Hexo Blog 02：更換 Hexo 主題，初探 NexT

前一篇系列文章：使用 Hexo 迅速在 GitHub Pages 展開 Blog 旅程 最後列了一些使用 Hexo Blog 要解決的問題，最重要的應該就是更換主題了，因為要擴充功能什麼的幾乎都能透過更改主題的設定實踐。

人工在網上繞了圈後，發現最多人拿來作練習的主題是 NexT ，為了少走彎路，我首次換的主題也決定是它了，然而我發現 NexT 官方有新的推薦用法，先人的文章卻都還沒採用，因此我決定照官方推薦方式實踐。

目標

• 將預設主題換成 NexT

• 依照官方推薦的 Alternate Theme Config 方式來設定 NexT 的 config

環境

Hexo: 6.3.0

hexo-cli: 4.3.0

建置流程

1. 在 Hexo Blog 專案內安裝 NexT 主題：

   command line tool

   $ npm install hexo-theme-next

   我的版本：v8.14.0 (更新：2022/12/21)

2. 更改專案根目錄中的 _config.yml 檔案，來啟用 NexT 主題：

   將 theme: 的值由原先的 landscape 改成 next：

   _config.yml

   # Extensions
   ## Plugins: https://hexo.io/plugins/
   ## Themes: https://hexo.io/themes/
   theme: next #landscape

3. 複製 NexT 原始 config 的內容至專案根目錄，作為本專案的主題設定檔：

   在 Hexo Blog 專案內執行：

   command line tool

   $ cp node_modules/hexo-theme-next/_config.yml _config.next.yml

   這指令會在根目錄中建立 _config.next.yml 檔案，並複製 NexT 原始 config 的內容。

   註：之後要自定義主題設定只會修改 _config.next.yml，而不會直接改動任何 NexT 的原始檔案，這就是目前官方推薦的使用方式，這樣 NexT 之後做版本升級時，使用者的改動才不會影響程序，或是自定義的內容被覆蓋而遺失。

4. 重新部署 Blog：

   command line tool

   $ hexo clean && hexo deploy

5. 瀏覽 Blog 檢查主題是否更新

大功告成！

結語

NexT 主題簡潔優雅，不過仔細看更新後的 Blog 還是有些發現：

• 缺了 Categories 與 Tags 頁面

• 缺了文章相關統計：閱讀次數、文章字數、所需閱讀時間

• 缺了與讀者互動功能：留言板或聊天室

關卡還是滿多的，繼續加油吧！

下一篇系列文章：繼續探索 NexT