HEXO-NexT如何做出選單功能
在 Hexo 中使用 NexT 佈景主題 設置 Menu（選單） 可以讓你的網站更具結構性。以下是完整的設置步驟：
🛠 步驟 1: 打開 NexT 配置文件
- 前往你的 Hexo 根目錄。
- 打開 NexT 主題配置文件，通常位於：
1 | yamlthemes/next/_config.yml |
📝 步驟 2: 編輯 Menu 設定
找到配置文件中的 menu 區塊，通常看起來像這樣：
1 | menu: |
🧩 Menu 配置詳解
每一行都有三個部分：
1 | menu_item: 路徑 || 圖標 |
- **
menu_item**：選單項目的名稱（例如home,about等）。 - **
路徑**：指向的 URL 路徑（例如/about/）。- 根目錄頁面使用
/。 - 其他頁面使用
/page-name/。
- 根目錄頁面使用
- **
圖標**：使用 Font Awesome 圖標（可選）。- 例如：
fa fa-home代表首頁圖標。
- 例如：
🧩 新增自定義 Menu 項目
假設你要添加一個 「作品集」 選單項目：
1 | menu: |
🌐 多層選單（子選單）
NexT 也支援子選單，可以這樣設置：
1 | menu: |
🔄 步驟 3: 重新生成並部署
設置完成後，重新生成並部署你的網站：
1 | hexo clean |
🚀 完成後檢查
開啟你的網站，確認選單是否按照設置顯示。如果有問題，可以檢查配置文件的語法或重啟 Hexo 本地伺服器：
1 | hexo server |
📌 小提示
- Font Awesome 圖標：可以在 Font Awesome 網站 查找更多圖標。
- 順序調整：修改配置文件中選單項目的順序會影響它們在網站上的排列順序。
改完發現還沒出來，原來是預設的 config.yml 設定中，menu 部分的項目都被註解（#）掉了，這就是為什麼 Menu bar 沒有顯示的原因。取消註解（去掉 # 符號）讓選單項目就顯示出來了。
🛠️ 修正方法：取消註解
將以下內容中的 # 刪除，保持每行的格式正確，這樣它們才會在網站中顯示：
yaml
複製程式碼
menu: home: / || fa fa-home about: /about/ || fa fa-user tags: /tags/ || fa fa-tags categories: /categories/ || fa fa-th archives: /archives/ || fa fa-archive # 如果不需要某項，可以保留註解或刪除該行
🔍 檢查格式：
- 縮排：保持
menu:下的每個項目都有兩個空格縮排。 - 連結設定：
home: /表示首頁連結。/about/是指向你的「關於」頁面。請確認你的 Hexo 中是否有這些頁面（例如source/about/index.md）。
- 圖示設定：
|| fa fa-home使用的是 Font Awesome 圖標。如果你沒有引入 Font Awesome，也可以移除||後的圖標部分。
🚀 生成與部署：
更改完 config.yml 後，記得重新生成並部署網站