新年新家系列第一篇博文中,我介绍了使用Google Blogger作为博客平台两个月来的心得体会,以及决定将其放弃的原因:我想要保证本地和网站服务端内容同步,并且希望能够拥有更为优雅的发布体验。 本篇博文将首先介绍选择Hugo的原因,然后介绍网站内容配置和迁移的过程中遇到的问题以及相应的解决方法。最后,分享一下我目前的博文撰写和发布的工作流。

选择Hugo的原因

搭建静态网站的工具有很多,除了Hugo外,常见的还有jekyllpelicanzola等。选择使用Hugo,主要有三个方面的原因:

  1. 我正在将自己的主要编程语言转为Golang;
  2. Hugo开源免费,社区比较活跃,有很多高质量的主题;
  3. 据说工程结构比较清晰,可以方便地进行个性化配置。

初识Hugo

本系列不是教程,所以不会给出详细的配置过程,参考官方文档可以十分顺利地完成Hugo环境的搭建。我主要介绍一下我在博客内容迁移过程中所遇到的一些问题。

主题选择

Hugo主题官网上提供了数百个主题,可以根据个人需求进行选择。为了平衡易用性和美观,以及自己的博客内容,我选择了PaperMod主题。页面简洁,并且提供了归档、搜索以及目录生成的功能。

评论工具

Hugo本身没有提供网站评论工具,虽然在官方文档中推荐了一些第三方平台,比如DisqusCactus CommentsCommento等,但要么免费服务含广告,要么需要自己部署,都不是十分满意。后来,我在Hugo用户论坛上看到有人推荐cusdis,提供免费的评论托管和通知的服务,支持匿名评论和审核发布,并且不含多余的广告(仅在评论框下面有Comments powered by Cusdis的超链接)。仔细评估后发现,cusdis基本可以满足我的需求,评论框风格和网站主题也比较搭配,所以暂时将其作为网站的评论服务平台。

菜单设置

菜单设置可以照搬之前Blogger上的内容,主要包括“归档”、“标签”和“搜索”三个对博文进行管理的部分,以及版权声明和读书记录两个功能。菜单内容可以直接在网站config文件中进行配置。在配置过程中遇到了一个问题,到现在都没有解决。“标签”页面是主题文件中定义好的,但是没有对多语言进行适配,无论语言设置为何,在“标签”页面“HEAD”部分始终显示为“Tags”,在中文页面中显得十分违和。需要后面研究一下主题文件再进行问题的解决。

博文编辑

Hugo使用Markdown进行博文的编辑,和我的写作习惯保持一致。但是不知出于什么原因,Hugo不能识别Markdown中的html语句,使得一些很简单的事情变得复杂。比如在之前写作的时候,可以直接使用<img src="IMG_001.JPG" alt="IMG_0015" style="zoom:50%;" />实现图片的缩放,在Hugo中就不行。好在Hugo提供了Shortcodes功能,可以利用编写好的脚本,对缺失的功能进行实现。根据需求创建自己的Shortcodes,可以对网页内容进行极高程度的个性化。

我的工作流

我目前使用Obsidian进行内容的创作和管理,当一篇文章完成准备发布时,需要进行以下操作:

  1. 进入Hugo工程目录,使用Hugo命令新建博文.md文件;
  2. 使用Typora打开新建好的文件,将Obsidian中的内容复制进去,并调整图片、反向链接的语法格式以能够被Hugo识别;
  3. 使用Hugo命令编译网站;
  4. 将编译好的网站文件上传到托管平台。

可以发现,整个文章文章发布的过程还是很繁琐的,并没有想象中的优雅。仔细分析一下,最大的问题在于不能直接发布Obsidian写好的.md文件,一方面原因是需要额外添加一些Hugo需要的meta-data,另一方面在于需要对图片路径、语法以及Obsidian的反向链接进行调整。后面我将试着编写一些脚本来自动化文章发布的工作流,使其变得更加优雅。

目前已经完成了博客主体内容的迁移,并将其以GitHub Pages的形式发布,后面的工作除了自动化脚本外,还需要进行网站统计工具的配置以及细节调整。在过渡期间,我将同时在Google BloggerGitHub Pages进行博客内容的发布,待所有工作完成后,再正式将域名映射到GitHub Pages,届时将发布新年新家系列的最后一篇文章进行总结。

期待正式搬家的那一天😀