WordPress 首頁與部落格頁設定的差別與做法

剛裝好的 WordPress,打開網站看到的是一排由新到舊的文章列表,這就是預設的部落格型首頁。但如果你想做的是公司形象站、品牌官網或商店,會希望訪客一進來先看到精心設計的版面,而不是一篇篇文章。這時就要動到「WordPress 首頁部落格頁設定」這一塊。

問題是,很多人把首頁換成自己做的頁面後,原本那份文章列表整個消失了,選單上點不到、網址也找不回來,以為內容被刪掉了。其實沒有,只是 WordPress 把「首頁」和「文章列表頁」拆成兩個獨立的位置在管理,你只設定了其中一個。

這篇會把首頁(Front Page)、文章頁(Posts Page)、一般頁面三者的角色講清楚,帶你在後台一次設好靜態首頁與獨立的部落格列表頁,並補上競品教學常略過的細節:被指定成文章頁的頁面內容為什麼不會顯示、區塊主題(網站編輯器)下的差異、WooCommerce 商店頁的關係,以及設錯時怎麼救回來。

WordPress 的首頁、文章頁、一般頁面差在哪

先把三個名詞分清楚,後面的設定才不會混淆。WordPress 在「設定 > 閱讀」裡實際在指派的是兩個系統角色,而頁面(Page)只是被拿來填進這兩個角色的素材。

  • 首頁(Front Page):訪客輸入你的網域、不帶任何路徑時看到的那一頁,也就是網站的門面。它可以是「最新文章列表」,也可以是「一個你指定的靜態頁面」。
  • 文章頁(Posts Page):專門用來列出所有文章(Post)的彙整頁,依發佈日期由新到舊排序,文章多了會自動分頁。它就是一般人講的「部落格頁」。
  • 一般頁面(Page):關於我們、聯絡我們、服務介紹這類不會排進文章流的固定內容。一般頁面本身只是內容,要等你在閱讀設定裡把它「指派」成首頁或文章頁,它才會接手那個角色。

關鍵觀念是:首頁與文章頁是兩個可以分開指定的位置。預設情況下這兩個角色由同一個東西扮演,也就是文章列表既是首頁也是部落格頁。一旦你把首頁換成靜態頁面,文章列表並不會自動搬到別的網址,除非你另外指定一個頁面來當文章頁。沒指定,文章列表就「沒有家」了,這正是部落格頁看似消失的真正原因。

下表把三者的角色與設定位置整理在一起:

角色 顯示什麼 在哪裡指定 內容由誰提供
首頁 Front Page 網域根目錄看到的畫面 設定 > 閱讀 > 首頁 最新文章,或你選的一般頁面
文章頁 Posts Page 全站文章的列表彙整 設定 > 閱讀 > 文章頁面 由 WordPress 自動列出文章
一般頁面 Page 單一固定內容 頁面 > 全部頁面 你在頁面編輯器寫的內容

為什麼 WordPress 預設首頁是文章列表

預設值是文章列表,是因為 WordPress 最早是一套部落格系統。對純寫作的部落客來說,訪客每次進站就看到最新一篇,是最直覺也最方便的設計,至今仍有不少站長刻意保留這種樣貌,不另外做首頁。

但 WordPress 後來長成可以架形象站、電商、作品集的通用系統,部落格式首頁就不再適合所有人。形象網站希望門面是一張能快速傳達品牌定位與服務範圍的頁面;商店則希望先呈現主打商品或分類。這類需求就需要把首頁從「最新文章」改成「靜態頁面」。

判斷自己該用哪一種,可以這樣抓:內容以持續更新的文章為主、希望讀者一進來就追最新動態,留最新文章當首頁即可;網站要當品牌或產品的門面、文章只是其中一個區塊,就改用靜態首頁,再把文章列表獨立放到一個分頁。

怎麼在後台設定靜態首頁

設定靜態首頁的入口在「設定 > 閱讀」,整個動作不到一分鐘,但有個前置條件:你要先有一個做好的頁面當首頁。

第 1 步、先建立首頁用的頁面:到「頁面 > 新增頁面」,做一個你要當門面的頁面並發佈。命名建議直接叫「首頁」或「Home」,方便日後辨識。如果還沒設計好版面,可以先發佈一個空白頁佔位,之後再用區塊編輯器或頁面編輯器外掛慢慢排。

第 2 步、進入閱讀設定:到「設定 > 閱讀」,最上方的「首頁顯示」預設勾在「你的最新文章」。把它改選成「靜態頁面」。

第 3 步、指定首頁:切換成靜態頁面後,下方會出現「首頁」下拉選單,選你剛剛建立的那個頁面。

第 4 步、儲存:捲到底按「儲存變更」。回到前台輸入你的網域,看到的就是指定的那一頁了。

除了後台這條路,也可以走前台的「外觀 > 自訂 > 首頁設定」做一樣的切換,效果相同,差別只在自訂工具能即時預覽。新版區塊主題沒有「自訂」這個選項時,仍可從「設定 > 閱讀」設定,這點下一段會講。

怎麼把原本的部落格頁找回來

把首頁換成靜態頁面後,原本的文章列表會跟著不見,要救回來只需要再指定一個頁面當文章頁,整個過程同樣在閱讀設定裡完成。

第 1 步、建立一個空白頁面當文章頁:到「頁面 > 新增頁面」,標題取「部落格」「最新文章」或任何你想要的名稱都可以。重點是這個頁面內容保持空白,不用寫任何字。原因下一段會解釋。發佈它。

第 2 步、注意網址代稱:頁面右側的「網址代稱(slug)」會決定文章列表的網址。不管標題取中文還是英文,代稱建議填英文的 blog,這樣文章列表的網址會是 你的網域/blog,乾淨好記也對 SEO 友善。

第 3 步、指定文章頁:回到「設定 > 閱讀」,在「靜態頁面」底下會看到「文章頁面」下拉選單,選剛剛建立的那個空白頁,儲存變更。

第 4 步、確認與掛上選單:打開 你的網域/blog,應該就能看到完整的文章列表了。最後到「外觀 > 選單」,把這個部落格頁加進導覽選單,訪客才點得到,不用每次手動打網址。

設完之後,首頁是你設計的靜態頁面,/blog 是文章列表,兩個角色各就各位,互不干擾。

被指定成文章頁的頁面,內容為什麼不會顯示

當一個頁面被指派為「文章頁」後,它原本在編輯器裡寫的內容與標題都不會顯示在前台,WordPress 會用該頁的位置自動輸出文章列表蓋過去。這跟「指定頁面當首頁」的行為不一樣,首頁那個頁面的內容會照常顯示,這也是很多人困惑的點。

背後是 WordPress 的模板階層(Template Hierarchy)在運作。瀏覽器請求文章頁時,WordPress 不會去讀單一頁面用的 page.php 模板,而是改用 home.php(找不到就退回 index.php),由這支模板跑迴圈把文章一篇篇撈出來列。你在頁面編輯器裡敲的文字,根本不在這支模板的輸出流程裡,自然看不到。

所以那個頁面才要保持空白,寫了也是白寫。如果你希望文章列表上方能放一段引言或橫幅,正規做法是改子主題的 home.php 模板,或改用支援文章列表區塊的區塊主題,而不是在頁面內容硬塞。

區塊主題與網站編輯器下有什麼不同

如果你用的是區塊主題(Block Theme,例如 Twenty Twenty-Four 之後的官方主題),後台選單會多出「外觀 > 編輯器」,少了傳統的「外觀 > 自訂」。但首頁與文章頁的指派邏輯沒變,「設定 > 閱讀」那組選項依然存在、依然有效,先在這裡把靜態首頁和文章頁指定好。

差別在「長相由誰決定」。傳統主題靠 PHP 模板檔(front-page.phphome.php);區塊主題改用網站編輯器裡的「範本(Templates)」,例如首頁範本、文章彙整範本,全部用區塊視覺化編輯,不必碰程式碼。想調整文章列表的呈現,是進「外觀 > 編輯器 > 範本」改對應範本,而不是去改頁面內容。

換句話說,閱讀設定負責「指派角色」,主題負責「角色長什麼樣」,這個分工在傳統主題與區塊主題都成立,只是後者把改外觀的工具從程式碼換成了區塊介面。

WooCommerce 商店站的首頁與商店頁怎麼安排

裝了 WooCommerce 的網站會多一個「商店頁(Shop Page)」,它和文章頁是兩套各自獨立的設定,別搞混。商店頁列的是商品,文章頁列的是文章,兩者可以同時存在。

WooCommerce 安裝時會自動建立「商店」「購物車」「結帳」「我的帳戶」等頁面,商店頁要指定哪一頁是在「WooCommerce > 設定 > 商品 > 一般」裡選,不在「設定 > 閱讀」。電商站常見的安排是:靜態頁面當首頁放主打與促銷、商店頁列全部商品、再視需要保留一個文章頁放教學或公告。

收款相關的設定(金流串接、付款方式啟用)屬於 WooCommerce 另一塊獨立的設定區,和首頁、商店頁的指派無關,這裡先不展開。重點是先把首頁、商店頁、文章頁三個角色想清楚要各自指向哪一頁,網站的導覽結構才會順。

首頁與文章頁設定有哪些 SEO 要注意

首頁是全站權重最集中的入口,建議把它指向最能代表網站、關鍵字定位最清楚的頁面,無論是靜態首頁還是文章列表。把單薄的空白頁設成首頁,對搜尋表現沒有幫助。

文章頁與首頁如果同時都吃文章列表,有機會產生內容重複的疑慮。把首頁改成靜態頁、文章列表獨立到 /blog,反而讓兩者各自有明確主題,對搜尋引擎理解網站結構更友善。文章頁的網址代稱用英文 blog 也比中文或拼音網址好維護。

「設定 > 閱讀」最下方還有一個「搜尋引擎可見度」核取方塊,勾選後會請求搜尋引擎不要收錄整站。正式上線的網站務必確認沒有勾它,否則做再多 SEO 都不會被收錄;這個設定靠搜尋引擎自律,但主流引擎都會尊重。此外,同頁的「網誌頁面最多顯示」決定文章列表每頁幾篇,預設 10 篇,篇數與分頁也會影響使用者瀏覽與爬蟲抓取的深度,依主題版面斟酌即可。

設定後出狀況的常見排查

如果照上面設定後前台沒照預期顯示,多半是下面幾種情況,逐項對一下通常都能解決。

  • 前台還是舊畫面:先清快取再看。有裝快取外掛或主機端快取時,前台會停在更新前的版本,清掉快取、重新整理即可,這不是設定本身的問題。
  • 文章列表頁是空白的:確認你指定成文章頁的那個頁面內容本來就該空白,文章列表是 WordPress 自動產生的。若連列表都沒有,檢查站上是否真的有已發佈的文章,以及主題的文章彙整範本是否正常。
  • 首頁與文章頁不小心選到同一頁:閱讀設定裡的「首頁」和「文章頁面」必須選兩個不同頁面,選成同一個會衝突。分別指向兩個獨立頁面就好。
  • 找不到原本主題的部落格版面:多數免費主題並沒有現成的「部落格頁面」實體,照前面「建立空白頁面 + 指定為文章頁」的做法就能取得文章列表頁,不需要去複製主題的 index.php
  • 選單點不到部落格:指定文章頁只是讓那個網址生效,要讓訪客找得到,還得到「外觀 > 選單」手動把它加進選單。

把首頁、文章頁、一般頁面三個角色的關係理順,後台這幾個選項其實很單純:閱讀設定負責決定誰當首頁、誰當文章列表,主題負責決定它們長什麼樣。下次要調整網站門面或搬動部落格位置時,先回到「設定 > 閱讀」確認這兩個角色各指向哪一頁,再去動版面,就不會再發生部落格頁莫名消失的狀況了。

相關文章
標籤: WooCommerce, WordPress, 靜態首頁, 文章頁, 閱讀設定