前言
Hexo搭建静态博客踩坑日记(一), 我们说到利用Hexo快速搭建静态博客.
这节我们就来说一下主题的问题与主题的基本修改操作.
起步
- chrome
- github
- hexo
- git
- node.js
寻找主题
chrome 搜索 github, 接着github全站搜索hexo-theme 相关项目.
为了方便, 这里给出主题地址推荐.
Hexo Star排名靠前的5个主题：
- iissnan/hexo-theme-next, star 15k
- litten/hexo-theme-yilia, star 7.2k
- bolnh/hexo-theme-material, star 3.8k
- ppoffice/hexo-theme-icarus, star 3.3k
- ...
- ...
- 本次以matery作为主题配置
- blinkfox/hexo-theme-matery, star 1.6k
数据由GitHub复制而来，排名请以实际为主
主题下载/配置修改
进入上次提到的hexo初始化目录 blog目录下.
>> cd blog
# 下载主题
>> git clone https://github.com/blinkfox/hexo-theme-matery.git theme/matery
...
...
# 修改配置
>> vim _config.yml # 不熟悉vim操作的 可以用text等文本文件打开修改 theme 对应的主题
...
...
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
# 找到theme: 按a或者i 进入编辑模式, 把主题修改为matery.
# 然后esc退出编辑模式, 按:键, 然后输入wq 回车即可保存退出
theme: matery
...
...
重启应用
# 清除缓存
>> hexo clean
INFO Deleted database.
INFO Deleted public folder.
# 构建生成 generate
>> hexo g
...
...
INFO 128 files generated in 186 ms
# 本地查看
>> hexo s
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
# 发布到github or gitee
>> hexo d
这样就可以看到主题效果啦, 如果出现没有css样式, 推荐检查一下 theme: name 与 theme文件夹下的 主题文件夹名称是否一致.
效果展示: >>my-hexo-blog
后记
到这里应该可以简单的看到主题效果了, 如需个性化主题, 可阅读github下的readme文档(中英文自由看大佬您的选择). 基本操作就是 cnpm install 需要的插件 然后 修改blog下的 _config.yml. 还有就是修改主题文件夹(eg: matery文件夹)下的 _config.yml.
图片会后期根据建议补充, 还请大家有问题多多交流.