Ghost 教學:如何建立網站文章分類導覽列

用 Ghost 內建的 Tag 和 Navigation 功能,三分鐘就能幫部落格建好分類導覽列。

Ghost 教學:如何建立網站文章分類導覽列
Photo by Ilya Pavlov / Unsplash

Ghost 沒有內建「分類」功能,但它的 Tag 系統完全可以達到同樣的效果,設定時間不用三分鐘。

流程非常簡單:建立 Tag、套用到文章、把 Tag 頁面加進導覽列。


第一步:建立 Tag

進入 Ghost 後台,左側欄點選 Tags,然後點右上角的 New tag

每個 Tag 需要填的欄位:

  • Name:顯示名稱,例如 Build
  • Slug:網址用的識別碼,會自動從 Name 生成,通常不需要改。Build 會自動變成 build,對應的頁面網址就是 yourblog.com/tag/build/
  • Description:選填,部分主題會把這段文字顯示在 Tag 頁面的頂端

其他欄位(Social、Meta)暫時不用管,之後想做 SEO 再回來填。

重複這個動作,把所有分類都建好。以我的部落格 Limen 為例,我建了五個:

NameSlug用途
Buildbuild工具搭建、side project 紀錄
Teamfight Tacticsteamfight-tactics聯盟戰棋相關內容
Thinkthink新聞議題分析、觀點文章
Read & Watchread-and-watch讀書筆記、影評
Notesnotes個人隨筆

第二步:幫文章加上 Tag

打開任何一篇文章的編輯器,點右上角的齒輪圖示(Post settings),在 Tags 欄位輸入對應的 Tag 名稱即可。一篇文章可以加多個 Tag。

第一個 Tag 會被 Ghost 視為「Primary Tag」,部分主題會優先顯示這個標籤。如果一篇文章同時屬於多個分類,把最主要的那個放在第一位。

第三步:把 Tag 頁面加進導覽列

到 Settings → Navigation,會看到兩個區塊:

  • Primary navigation:網站頂部的主導覽列
  • Secondary navigation:通常顯示在頁尾,視主題而定

在 Primary navigation 區塊,新增項目:

  • Label:填你要在導覽列上顯示的文字,例如 Build
  • URL:填 /tag/build/

重複操作,把所有分類都加上去。排列順序可以用拖曳調整。

按下 Save 後,回到部落格首頁重新整理,導覽列就會出現這些分類連結。


補充:Tag 頁面會長什麼樣子

點進任何一個 Tag 頁面(例如 /tag/build/),Ghost 會自動列出所有帶有該 Tag 的文章,排序預設是最新的在最上面。頁面的外觀由你使用的主題決定——大多數主題都有內建的 Tag 頁面模板,不需要額外設定。