Hexo 部落格主題#
Hexo 預設的主題簡陋？不好看？不喜歡？
其實想要更換 Hexo 的主題很簡單，Hexo 提供了可插拔式的主題機制，讓我們可以輕鬆地更換部落格主題。
可以在「官方收集的主題列表」挑選任意一個你喜歡的主題，總有一個適合你。
「skapp」這個主題挺不錯的，接下來就參照這個主題的官網教程進行安裝使用。
主題的安裝（skapp）#
利用 Docker 快速搭建 node.js v8.9.3 環境
docker run -it --name node8 --rm \
-v $(pwd):/app -w /app \
-p 4000:4000 \
node:8.9.3 /bin/bash
在 windows 下各種報錯，無奈轉到 Linux 的機子上操作
cd blog
# 將 skapp 主題 clone 至 themes/skapp 資料夾下
git clone https://github.com/Mrminfive/hexo-theme-skapp.git themes/skapp
# 安裝 skapp 主題指定的依賴
# 基於 2018-12-19，有個小坑：要使用 node.js v8.9.3 版本才能正常安裝這些依賴，是由於 lunr 仍然在使用 nodejieba 2.2.5 引起的
npm install --save hexo-autoprefixer hexo-filter-cleanup hexo-generator-feed hexo-generator-sitemap hexo-renderer-sass hexo-renderer-swig mamboer/lunr.js moment node-sass object-assign
hexo clean
hexo server
🚩 能否使用
Git Submodule進行管理第三方主題？
上面直接 clone 了 hexo-theme-skapp 倉庫於 themes/skapp，帶有 .git 資料夾，git 識別為 Submodule，但沒有產生外鏈到原 hexo-theme-skapp 倉庫，只是個普通的資料夾。當我們把自己的部落格倉庫 clone 到本地後會發現 themes/skapp 只是一個普通的空資料夾 😧，主題不見了。
那能不能在執行 clone 操作時能直接拉取該主題倉庫，而且該主題的源碼不託管在我們的倉庫中呢？可以的，這時就該使用 git submodule 了 👍。
# 先取消暫存 themes/skapp 目錄
git rm -r themes/skapp
# 添加子模塊
git submodule add [email protected]:Mrminfive/hexo-theme-skapp.git themes/skapp
# 可以看到新增 .gitmodules 檔案
git status
.gitmodules 描述了 Submodule 的遠端倉庫資訊與本倉庫的相對路徑：
[submodule "themes/skapp"]
path = themes/skapp
url = [email protected]:Mrminfive/hexo-theme-skapp.git
.git/config 中也自動添加了 submodule 資訊：
[submodule "themes/skapp"]
url = [email protected]:Mrminfive/hexo-theme-skapp.git
active = true
以及產生了 .git/modules 資料夾，最後提交並推送到部落格的遠端倉庫：
git commit -m 'chore: convert to skapp submodule'
git push
GitHub 倉庫 上會顯示出當前所引入的子模塊版本：
當我們在其他地方進行倉庫的 git clone [email protected]:y0ngb1n/y0ngb1n.github.io.git 時，發現 themes/skapp 是個空資料夾，意味著沒有安裝該主題。那麼如何 clone 一個完整的倉庫呢？只需如下操作即可：
# 方式一：使用 submodule init / update
git clone [email protected]:y0ngb1n/y0ngb1n.github.io.git blog && cd blog
git submodule init && git submodule update
# 方式二：添加 --recursive 參數
git clone [email protected]:y0ngb1n/y0ngb1n.github.io.git --recursive
當該第三方主題更新了，我們可以更新子模塊：
git submodule update --remote themes/skapp
或者切換至 themes/skapp 目錄下使用 git 命令切換到不同的歷史版本，如果對子模塊執行了相關操作後，會提示 modified: themes/skapp (new commits)：
$ git status
On branch source
Your branch is up to date with 'origin/source'.
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git checkout -- <file>..." to discard changes in working directory)
modified: themes/skapp (new commits)
然後按正常流程提交並推送到遠端倉庫即可。
主題的配置#
主題的相關配置可以參考「skapp 官方說明」，可以設置：菜單、部落格資訊、聯繫方式、外部鏈接等。
header 的背景圖（隨機圖）
使用了「Spencer Woo」家提供的 https://api.spencerwoo.com 接口，可隨機不同的圖片，在 _config.yml 中設置：
## header 的背景圖
header_cover: https://api.spencerwoo.com
開啟「不蒜子統計」
skapp 主題已經集成了「不蒜子統計」，但預設是關閉的，只需在 _config.yml 中開啟即可：
# Busuanzi
busuanzi: true
歡迎圍觀 我的部落格 https://y0ngb1n.github.io/ 👋
自定義樣式#
待續...