GitHub+HEXO博客更換主題

寫在前面

前面講了怎麼使用GitHub+HEXO搭建論壇,這裏寫這個論壇如何更換主題。對於如何安裝HEXO和部署到GitHub的問題,見我另一篇文章使用GitHub+HEXO免費搭建個人博客(最詳細),這裏就不詳細描述了。文章可能還有很多不足,請大家諒解,歡迎大佬提意見。
個人博客效果預覽:http://blog.nineya.com
Hexo主題地址:https://hexo.io/themes/

本文使用的東西

  1. win10系統的電腦
  2. HEXO 4.0.0

1.下載主題

1.1選擇主題

點擊https://hexo.io/themes/,進入選一個自己喜歡的主題。點擊圖片可以進入預覽主題(有的主題預覽鏈接是死鏈),點擊主題名稱可以進入主題的GitHub倉庫。
藍色粗體的是主題名稱,等下克隆時候要用到
下載主題

1.2複製鏈接

選中主題,點擊“clone of download”複製主題的克隆鏈接。
在這裏插入圖片描述

1.3克隆主題

1.打開我們博客的主目錄,右鍵點擊“Git Bath Here”。
主目錄
2.在Git Bash中輸入克隆命令,命令如下

git clone 剛纔複製的主題克隆鏈接 themes/主題名稱

例如我的克隆鏈接爲

git clone https://github.com/fan-lv/Fan.git themes/Fan

克隆

2.使用主題

2.1添加依賴包

1.有的主題要求添加一些依賴包纔可以運行,需要的依賴包在GitHub中作者都會有說明的,這裏我需要添加兩個依賴包。
依賴
2.打開Node command prompt,使用cd定位到我們博客的位置,輸入添加依賴包命令。
依賴包添加命令如下,“@版本號可以省略”直接下載默認版本。

npm install 依賴包名@版本號 --save

當然配置了數據源的也可以用以下命令添加依賴包,網絡會更穩定。如何配置數據源見我另一篇文章Node.js安裝和數據源的配置

cnpm install 依賴包名@版本號 --save

例如我需要添加這兩條依賴

cnpm install hexo-renderer-jade --save
cnpm install hexo-renderer-stylus --save

在這裏插入圖片描述
在這裏插入圖片描述

2.2使用主題

1.打開博客目錄下的“_config.yml”文件,找到theme:位置,將主題改爲我們要使用的主題名,我這裏剛剛克隆的主題是“Fan”。
在這裏插入圖片描述
2.返回Node Command Prompt,輸入“hexo server”運行,發現我們主題已經改變了。如果你已經配置了GitHub,這時候你就可以輸入“hexo clean && hexo g && hexo d”提交修改主題後的博客。
修改主題後的效果圖
我的博客

3.可能出現的依賴問題

在修改主題中可能出現依賴版本問題,可能不同主題要求的依賴包版本不同,不同的版本可能導致主題使用出現問題。這裏我提供一個解決方法。

3.1瞭解Hexo目錄結構

首先先了解一下hexo的目錄結構,在hexo中“node_modules”用戶存儲依賴包,“package.json”文件用來引用依賴。
在這裏插入圖片描述

3.2修改依賴

如果我們使用主題時出現問題,可以打開“package.json”文件,找到我們主題使用的依賴,將其刪除引用,重新用命令添加依賴引用。
圖爲我剛剛添加的依賴。
在這裏插入圖片描述
如果刪除依賴引用沒有效果,就進入“node_modules”目錄,找到我們用到的依賴包目錄,將其刪除,例如我剛剛用到的依賴“hexo-renderer-jade’”目錄爲“[email protected]@jade”,看依賴名字都可以看出來對應目錄的的。
在這裏插入圖片描述

4.總結

hexo博客主題還是很豐富的,修改主題也比較簡單,但是如果出現依賴問題就比較麻煩,如果出現問題,可以通過我以上的方法從新添加依賴。有不清楚的地方歡迎評論留言,看到的我都會回覆的。本文到此結束,有什麼不足的地方請大家不吝指正。

發佈了44 篇原創文章 · 獲贊 29 · 訪問量 1萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章