折腾了一圈,最终还是回到了原点,使用静态博客系统。以前用过 hexo,所以还是继续用它吧。
1. 安装 hexo
直接参考hexo官网的安装说明就行,很简单,执行两行命令而已
1 | sudo apt install nodejs git |
2. 初始化博客
1 | hexo init qiushao.net |
然后从头到尾看一遍 _config.yml 配置文件,看看哪些东西需要修改的,都一一修改了。
执行完以上几个步骤,一个最原始的 hexo 博客系统就已经搭建完成了,可以访问一下浏览器 http://localhost:4000/
接下来是各种个性化的配置了。
3. 切换 pure 主题
pure 是我见过的主题中最喜欢的了,经典的三列式布局。自带全文搜索,支持各种第三方评论系统。
1 | git clone https://github.com/cofess/hexo-theme-pure.git themes/pure |
修改 _config.yml 配置文件
1 | ## Themes: https://hexo.io/themes/ |
重新启动一下 hexo server,就已经切换到 pure 主题啦。
接下来要对主题作一系列的个性化配置。
3.1 启用全文检索
1 | npm install hexo-generator-json-content --save |
启用这个插件后,重新启动 hexo server,点击导航栏,头像下边的 search 输入框就可以进行全文检索了。
3.2 导航栏配置
pure 主题相关的配置都在 themes/pure/_config.yml 文件里面,里面的配置基本一看就懂,一步步修改看效果就行。menu:
项用于配置左边的导航栏要显示哪些入口。
我个人没有豆瓣书单,github 又没有拿得出手的项目,所以这两项给注释掉了。
3.3 开启文章章节目录导航
文章章节目录导航的配置在 config 项 下的 toc, 默认就是开启的, 但是我们在文章详情页却看不到目录导航。
因为,开启这个选项后,每篇文章头的配置都要加上 toc: true
才行,比如:
1 | --- |
这个感觉有点不合理,一开就全开就行了,还要每篇文章都配置一下,太烦了,还可能会忘了。
因此自己修改了一下主题的代码,首先查找一下 toc 相关的文件:
1 | grep -nr toc |
从查找的结果上看有两个地方需要修改一下 layout/_partial/post/nav.ejs, layout/_partial/sidebar-toc.ejs。
把这两个文件的 && post.toc
条件给去掉就行。
3.4 评论系统
推荐使用 Valine 作为评论系统,
评论都放在自己的 leancloud 数据库上,
使用其他的第三方平台评论系统的话,总担心平台突然GG了。
使用方法很简单,只要在 leancloud 注册一个账号,然后新建一个应用。
在应用管理页找到 appid, appkey 填到 themes/pure/_config.yml 里面的 valine 配置项即可。
1 | valine: # Valine. https://valine.js.org |
下面还有一个 pv 的配置项,当开启 pv 配置项时, 不知为什么文章阅读量统计会失效。
3.5 分类,标签等页面不可访问
按上面的步骤配置好后,这时左边导航栏的分类,标签,关于等页面是访问不了的。
需要手动 copy blog_path/theme/pure/_source/
目录下的所有文件夹到 blog_path/source/
目录下才行。
这里感觉可以优化一下,理论上来说这些布局文件直接放在 theme 里面就行了,没必要 copy 到 source 里面。
至此,基本上就都配置完了,遇到问题再补充。
搭建博客其实很简单,难的是持续不断的输出。
善始者实繁,克终者盖寡,希望自己能做一个善始善终的人。
以后不再折腾,专心内容的输出就行。
4. 发布
安装 git 发布插件
1 | npm install hexo-deployer-git --save |
_config.yml 中配置发布仓库信息
1 | deploy: |
然后使用 hexo d 命令即可将静态站点上传到 github。
5. 自定义域名访问
在 source 目录下添加一个 CNAME 文件,里面写上自己的域名即可。然后在域名解析添加一条 cname 规则,指向 qiushao.github.io 即可。
6. 添加RSS订阅
1 | npm install hexo-generator-feed --save |
修改根目录配置文件_config.yml,末尾添加以下配置
1 | # Extensions |
修改主题配置文件 _config.yml,把 rss 功能打开就行
1 | social: |