技術文件目前產品線:WordPress 入門

WordPress 建立 Page(頁面)完整教學

更新日期
閱讀時間
約 7 分鐘
來源狀態
generated-draft

本篇說明

本篇說明 WordPress 中 Page(頁面)與 Post(文章)的差異、如何建立與管理頁面、設定父子頁面階層、修改頁面網址(slug),以及頁面範本與動態產生機制等基本觀念,適合需要建立公司介紹、聯絡我們等固定內容頁面的網站管理者。

適合誰使用

WordPress 網站管理者、需要建立與整理靜態內容頁面(如關於我們、聯絡我們)的使用者

開始前準備

  • 需登入 WordPress 後台管理畫面

教學內容

Page 與 Post 的差異

Post 是一般部落格文章,預設會依時間倒序顯示在網站首頁。

Page 用於非按時間排序的內容,通常是關於自身或網站的長期不變資訊,例如 About、Contact、Privacy Policy 等。

Page 建立後可以加入網站的導覽選單,讓訪客能找到它。

Page 的特性

Page 可以組織成父頁面與子頁面(parent pages and subpages)。

Page 預設不支援分類(categories)、標籤(tags)等分類法,但可透過外掛加強。

Page 不會出現在網站的 Feed(如 RSS 或 Atom)中,也不會出現在部落格的時間排序畫面。

查看 Pages 畫面

Pages 畫面可依標題搜尋頁面、依 Published 或 Draft 篩選、依日期篩選,並能點選欄位標題依 Title、Date、Author 等排序。

  1. 登入 WordPress 後台管理畫面。
  2. 點選左側選單的 Pages,即可看到網站所有頁面的清單。

    The Pages screen
    官方文件介面截圖:The Pages screen

  3. 可勾選多個頁面後使用 Bulk actions 中的 EditMove to Trash 進行批次處理。

建立新頁面

  1. 登入 WordPress 後台管理畫面。
  2. 點選左側選單的 Pages > Add New,或在 Pages 畫面點選 Add New 按鈕。

    Two ways to add a new page from the WordPress administration screen.
    官方文件介面截圖:Two ways to add a new page from the WordPress administration screen.

  3. 輸入頁面標題。
  4. 使用區塊編輯器(block editor)中的各種 blocks 來設計頁面內容。
  5. 在側邊欄設定(sidebar settings)中自訂頁面相關選項。
  6. 完成後點選 Publish 發布頁面。

    New page screen
    官方文件介面截圖:New page screen

建立子頁面(Subpage)

父頁面(Parent Page)是最上層的頁面,子頁面則巢狀排列在其下,形成階層結構。

子頁面的 Permalink 會反映此頁面階層,例如 example.com/about/board-of-directors/。

  1. 登入後台,點選 Pages > Add New
  2. 在側邊欄設定的 Page Attributes 區塊中,打開 Parent Page 下拉選單,會列出網站中已建立的所有頁面。

    Creating sub pages under Parent page
    官方文件介面截圖:Creating sub pages under Parent page

  3. 從下拉選單中選擇要作為父頁面的頁面,目前建立的頁面就會成為該頁面的子頁面。

    Creating sub pages Board of Directors under Parent page About Us
    官方文件介面截圖:Creating sub pages Board of Directors under Parent page About Us

  4. 可在 Page Attributes 的 Order 欄位輸入數字 1,讓此頁面在使用預設選單時優先顯示。
  5. 輸入子頁面標題與內容。
  6. 完成後點選 Publish 發布。
  7. 若要建立其他子頁面,重複以上流程,並在 Order 欄位使用較大的數字(如 2、3)決定顯示順序。

修改頁面網址(Slug)

  1. 在 Pages 畫面中,將滑鼠移到頁面標題上並選擇 Edit

    Edit button in the Pages screen
    官方文件介面截圖:Edit button in the Pages screen

  2. 在 Page Sidebar settings 的 Summary 區塊中點選 URL 連結,開啟 URL 彈出視窗,修改 Permalink 欄位即可變更頁面網址。

    Changing the Permalink
    官方文件介面截圖:Changing the Permalink

    Change and View the Permalink updates
    官方文件介面截圖:Change and View the Permalink updates

  3. 確認新網址後,點選 Update 儲存變更。

使用 Quick Edit 修改頁面

  1. 在 Pages 畫面中,將滑鼠移到頁面標題上並選擇 Quick Edit

    Quick Edit the Page URL
    官方文件介面截圖:Quick Edit the Page URL

  2. Quick Edit 面板開啟後,可修改頁面的 Title、Slug、Date、Author,也能設定密碼保護或標記為 Private。

    Quick Edit Panel in the Pages screen
    官方文件介面截圖:Quick Edit Panel in the Pages screen

  3. 同一面板也能變更 Parent page、頁面順序(page order)、範本(template)與頁面狀態(Published、Pending Review、Draft)。
  4. 修改完成後點選 Update 按鈕儲存變更。

Page 範本與動態產生機制

範本(template)控制頁面的版面配置,與決定整體網站設計的佈景主題(Theme)不同,範本只影響單一頁面或多個頁面的外觀。

可以為頁面建立自訂範本(custom Page Templates),這會覆蓋佈景主題內建的預設頁面範本。

WordPress 中的 Page 內容是動態產生的,儲存在 MySQL 資料庫中,每次訪客瀏覽時會由目前佈景主題的範本重新產生頁面。

介面名稱對照

  • Pages:後台左側選單項目,用於管理網站所有頁面
  • Add New:用於建立新頁面的按鈕或選單項目
  • Page Attributes:頁面側邊欄設定區塊,可設定 Parent Page、Order、Template 等
  • Parent Page:下拉選單,用於選擇目前頁面所屬的父頁面
  • Quick Edit:在 Pages 清單中快速修改頁面資訊(如標題、Slug、狀態)的面板
  • Permalink:頁面的網址連結,可在編輯畫面中修改
  • Bulk actions:批次處理多個頁面的功能,例如批次編輯或移至垃圾桶

注意事項

注意

搜尋引擎對 Post 與 Page 的重視程度可能不同,較新的 Post 有時會比靜態 Page 更被視為相關內容。

注意

Page 預設不支援分類與標籤等分類法功能,如需使用需另外透過外掛擴充。

常見問題

Page 和 Post 有什麼不同?

Post 是依時間倒序排列的部落格文章,適合用於時效性內容;Page 則用於不隨時間變化的固定資訊,例如關於我們、聯絡我們,不會出現在部落格的時間排序畫面中,也不包含在網站的 RSS 等 Feed 內。

如何建立頁面的階層結構(父頁面與子頁面)?

在建立或編輯頁面時,於側邊欄設定的 Page Attributes 區塊中開啟 Parent Page 下拉選單,選擇要作為父頁面的頁面即可,該頁面即成為子頁面,其 Permalink 也會反映此階層關係。

要怎麼修改已建立頁面的網址(slug)?

可在 Pages 畫面將滑鼠移到頁面標題並選擇 Edit,在側邊欄 Summary 區塊點選 URL 連結修改 Permalink 欄位;或選擇 Quick Edit 直接在清單中修改 Slug 等欄位,完成後點選 Update 儲存。

官方來源

還是卡住了?

先把問題問清楚,通常比直接開工單更快。複製下面的結構,補上你的情況後送出。

用 AI 先釐清問題

/ai 我正在閱讀「WordPress 建立 Page(頁面)完整教學」,目前卡在:

我已嘗試:

我看到的畫面/錯誤訊息:

請用一步一步的方式告訴我下一步。

需要我們實際進入網站調整設定、修改佈景主題或處理資料時,再建立 /task 工單。