前言

Hexo主题琳琅满目
我作为一个二刺螈
当然我们的Blog也要二刺螈

2023.12.24

现在我变了
我要做一个不宅的二刺螈
还是浓度不要这么高捏
不然怎么认识姊姊仔

Hexo 主题推荐

Theme.Butterfly.Demo

现在作者依赖定制化太强
且主题也疏于维护了
小弟技术也不好
无法进行定制化的修改
那我们就使用butterfly吧

1
https://github.com/jerryc127/hexo-theme-butterfly

然后我们来看看作者大大的Demo

1
https://butterfly.js.org/

Theme.Shoka.Demo

之前一开始在用Theme.Shoka

1
https://github.com/amehime/hexo-theme-shoka

下面这个是Shoka开发大佬Ruri Shimotsuki的博客

1
https://shoka.lostyu.me/

Hexo 主题下载

下载 Hexo 主题十分简单
选择你喜欢的 Hexo 主题
我们直接在 Terminal 里面 git 一份就🆗
我们就直接使用稳定版吧

1
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

Hexo 主题修改

Hexo 文件配置修改

然后我们将主目录的 _config 文件中的主题
按照你们主题的文档改为想要的主题

1
2
3
4
5
# 原主题配置
- theme: landscape

# 新主题配置
+ theme: butterfly

修改之后就是这样的，然后保存

修改主题配置

主题配置的所有参数在 <root>/themes/butterfly/_config.yml 文件中
为了方便主题升级，请在根目录新建一个yml文件，命名为 _config.butterfly.yml
所有主题的自定义配置均保存于 <root>/_config.butterfly.yml 文件
修改完毕之后我们的文件夹就应该是这样的

安装 Hexo Butterfly 依赖插件

  • Butterfly 官方依赖

因为有的时候我们需要PNG和stylus的渲染器
我们直接在Blog文件夹中使用Powershell安装依赖

1
npm install hexo-renderer-pug hexo-renderer-stylus --save

生成使用新主题的 Blog

  • 记得重启一下Powershell 🤦‍

清除缓存文件 (db.json) 和已生成的静态文件 (public)

1
hexo clean

生成静态文件

1
hexo generate

本地开启服务进行预览

1
hexo server

部署到 Github

1
hexo deploy

部署效果

参考 & 引用

https://butterfly.js.org/posts/21cfbf15/