修改Hexo博客主题
安装
Butterfly
主题)打开命令行窗口,在
Hexo
博客根目录下执行如下命令安装Butterfly
主题 快速開始 | Butterfly](https://butterfly.js.org/posts/21cfbf15/#安裝)):1
npm install hexo-theme-butterfly
安装成功后可看到如下信息:
1
2
3
4added 39 packages, and audited 279 packages in 6s
27 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities安装的主题位于
<blog_root>/node_modules/hexo-theme-butterfly
目录下,其他两种安装方式 快速開始 | Butterfly](https://butterfly.js.org/posts/21cfbf15/#安裝))则位于`/themes/butterfly>`目录下,注意予以区分。 应用主题
在根目录下的
_config.yml
文件中将博客主题修改为butterfly
:1
theme: butterfly
安装插件
在根目录下执行如下命令安装用于渲染的
pug
和stylus
插件:1
npm install hexo-renderer-pug hexo-renderer-stylus --save
安装成功后会看到如下信息:
1
2
3
4up to date, audited 279 packages in 2s
27 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities预览主题
在博客根目录执行如下命令启动服务器
1
hexo s
服务器启动成功后,通过默认网址
http://localhost:4000/
访问静态网站查看主题:1
2
3
4
5
6
7
8
9
10
11
12
13INFO Validating config
INFO
===================================================================
##### # # ##### ##### ###### ##### ###### # # #
# # # # # # # # # # # # #
##### # # # # ##### # # ##### # #
# # # # # # # ##### # # #
# # # # # # # # # # # #
##### #### # # ###### # # # ###### #
4.8.1
===================================================================
INFO Start processing
INFO Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.升级主题
为了便于主题后续的升级,将主题目录
<blog_root>/node_modules/hexo-theme-butterfly
下的_config.yml
文件复制到博客根目录<blog_root>/
下并重命名为_config.butterfly.yml
。同时,务必保留博客根目录下的_config.yml
文件。Hexo
会自动合并主题目录中_config.yml
和_config.butterfly.yml
里的配置。博客根目录下的_config.butterfly.yml
具有较高的优先级,因此主题目录下_config.yml
文件中的同名配置会被覆盖。后续对于博客主题的配置请在_config.butterfly.yml
中进行,在主题目录下的_config.yml
文件中进行配置将不会产生预期效果。在博客根目录下执行如下命令可进行主题的升级,其他升级方式请查阅
Butterfly
官网安装文档 快速開始 | Butterfly](https://butterfly.js.org/posts/21cfbf15/#安裝)):1
npm update hexo-theme-butterfly