練習 1.3:將網頁移入網站
您必須先完成練習 1.2:設計網站結構,才能開始將網頁移入網站。
利用 Web Site Designer 中的網頁圖示佈置好網站之後,您就已準備好,可以開始建立您的網頁。
網頁圖示的邊框目前是虛線;這表示網頁圖示所代表的檔案(實際的網頁)不存在。
建立好這些檔案之後,網頁圖示的邊框會變成實線。
- 按兩下「檢視所有分類」網頁的網頁圖示。這時會開啟「建立網頁」對話框。
- 在這個指導教學中,您必須選取 Faces JSP 選項。這個選項會建立能夠使用 JavaServer Faces 技術的 JSP 網頁。
進一步學習 JavaServer Faces 和 Faces 元件。
您也可以在「利用 JavaServer Faces 在網頁中顯示動態資訊」指導教學中,學會如何利用 Faces 元件來新增資料連線到網站中。
- 按一下 確定。這時會開啟「新建 Faces JSP 檔」精靈。
- 接受預設資料夾 (/ClassifiedsTutorial/WebContent)。
- 在檔案名稱欄位中,輸入新檔案的名稱 all_records。
雖然佈置網站時將網頁指派給它的導覽標籤和檔案名稱相同對您可能很方便,不過,您也可以將檔案命名成對本端系統的資源有意義的名稱,而只將導覽標籤用來作為未來導覽的命名慣例。
- 確定已在標記語言欄位中選取 HTML。針對其餘欄位,請接受預設值。
- 保持不勾選配置進階選項勾選框。
如果您要配置新檔案的選項,如其他標示庫,您可以利用這個精靈來選擇指定其他選項;不過,就這個指導教學的目的而言,您可以接受預設值。
附註:新檔案會自動參照您建立 Web 專案時所建立的 Master.css。
- 按一下完成。
這時會在 Page Designer 中開啟這個新檔案。
- 按一下導覽 - 分類指導教學標籤,來返回 Web Site Designer。現在,您可以看到檢視所有分類圖示的邊框是實線,另外有一個小的藍色菱形圖示 (
),表示它已有相關的 JSP 檔,其他網頁圖示的邊框則仍是虛線,表示還沒有建立它們的檔案。
- 按兩下各個圖示及完成「新建 Faces JSP 檔」精靈來繼續建立其他網頁圖示的 Faces JSP 網頁。
在這個指導教學中,請遵循下列命名慣例:
- 公佈清單 -
new_record
- 更新清單 -
update_record
- 過濾清單 -
filtered_records
- 按 Ctrl+S 鍵來儲存網站導覽。
建立好四個網頁之後,您的「專案導覽器」視圖會將所有新資源顯示在 WebContent 資料夾之下:
現在,您已建立了網站將擁有的各個網頁的空白網頁。
您已準備好可以開始進行練習 1.4:設計網站的外觀與操作方式。