起因 #
之前的博客采用 hexo 进行驱动,整体风格现在看来也还是挺满意的,但是由于换了电脑,之前博客的源文件全部丢失了。加上看到 hugo 的编译效率比 hexo 快不少,于是干脆直接迁移过来。
距离上一次部署博客已经过了两年多了,这次部署前大概列了几项需求:
原则:
- 不要友链
- 不要评论区
- 支持 RSS 全文输出
- 文章页侧边有目录栏
加分项:
- AI 生成文章摘要
- 文章可以设置封面图
- 随机文章 ID
- 方便更换字体
关于原则的思考 #
大概是现在的自己越来越封闭,只想要把这个博客作为一个单纯写点东西的平台,想在不缺乏基本功能的前提下做到极简。
于是新的博客去除了文章评论区和友链页,整个页面干净了许多。如果真有什么问题需要交流,完全可以在关于页面找到我。
RSS #
首先,能够方便地进行 RSS 全文输出,对于我个人来说是非常必要的。hugo 原生就 支持 RSS 输出,相比 hexo 还需要安装插件,方便了不少。
需要注意的是,默认输出的 RSS 不是全文输出而是摘要输出,我的做法是:
将主题中的 rss.xml 复制到根目录进行修改,
也就是复制 themes/blowfish/layouts/_default/rss.xml 到 layouts/_default/rss.xml。
然后将 layouts/_default/rss.xml 中的
<description>{{ .Summary | html }}</description> 修改为
<description>{{ .Content | html }}</description> 即可。
随机文章 ID #
之前在 hexo 中使用了 hexo-abbrlink 插件,能够给每一篇文章生成一个随机的唯一 ID,因为默认的文章 URL 是标题,例如:https://kydins.com/posts/从hexo迁移到hugo/
这样子做有两个问题,一是太丑了,二是带有中文不利于 SEO。
在 hugo 中我参考了 Ramen 的Hugo 永久链接 的方案
永久链接的生成方案是比较简单的,直接对时间 + 文章名生成字符串做一下 md5 然后取任意 4-12 位即可。这样做的话 md5 冲撞概率极小,同时也没有那么大的运算负担。
而 Hugo 在永久链接中支持下面这个参数:slug。简单来说,我们可以针对每一篇文章指定一个 slug,然后在
config.toml中配置 permalinks 包含 slug 参数,就可以生成唯一的永久链接。我们的目的就是对每篇文章自动生成一个 slug。
由于是 2018 年的文章,现在的 hugo 配置已经变更,所以我做了一些改动:
修改 archetypes/default.md 添加如下一行:
slug = '{{ substr (md5 (printf "%s%s" .Date (replace .TranslationBaseName "-" " " | title))) 4 8 }}'
然后修改 hugo.toml 添加如下行:
[permalinks]
post = "/post/:slug"
之后每次新建文章都会有一个唯一的 ID。
字体 #
然后就是字体,方便更换字体也是非常重要的一点,目前本博客采用的字体是 LXGW Bright
因为使用的是 Blowfish 主题,更换字体请参考 Blowfish-进阶自定义
目录栏 #
现在使用的主题是 Blowfish,可以很方便得开启侧边目录栏,同时支持响应式布局,如果侧边空间不足,目录栏会显示在文章开头。
修改 config/_default/params.toml 中的
[article]
showTableOfContents = true # 是否展示文章的目录
即可开启侧边栏
AI 生成文章摘要 #
TODO
搭建 #
部署 hugo 和应用主题的方式非常简单,直接按照 官方文档 就可以,我是直接使用 git 子仓库的方式应用的主题,方便后期更新
值得注意的是,hugo 的默认配置文件已经从 config.toml 变为 hugo.toml,在看文档的时候需要注意一下
在 Cloudflare Pages 中发布 #
原先的博客是托管在GitHub Pages中,勉强能够满足使用但是有些小地方不是很舒服。一是使用GitHub Pages必须使用公开的仓库,二是GitHub Pages的网络在某些地方不够稳定。
因此决定趁这次机会,将博客托管到Cloudflare Pages中。参考官方文档:deploy-a-hugo-site