hugo,Obsidian,markdown

最近将网站从 wordpress 迁移到 hugo 生成静态页面的方式。在迁移时发现了一点非常大的好处:网站的内容和网站的样式完全的解耦。网站内容是纯 markdown 格式的,我写作的方式是利用 Obsidian 进行的,它也是完全跟笔记进行解耦,如果你用飞书或者 notion 那么你的内容是很难被其它软件进行处理的。

所以这里 hugo 做好生成网站的事情,Obsidian 做好本地编辑搜索的事情,markdown 则做好内容的事情,各自干好各自的事情。

非常符合 Unix 的设计原则。

迁移过程

从 wordpress 到 md

原笔记是交给 wordpress 进行管理的,wordpress 将内容都存储在 Mysql 中,且内容有部分被处理成了 html 格式。第一步就是转成 md 格式。首先利用 Python 脚本编写状态机解析器从 SQL 中提取内容、标题、时间、URL 等信息,存入到文件中去。然后利用 Pandoc 这个强大的文本格式转换器将其中的 html 标签转为 md 格式。这里遇到一个问题就是 Pandoc 会把 html 格式中的换行符给抹掉,所以需要在 Python 脚本提取时添加 <p></p> 这种空的段落来保留换行符。

hugo 静态生成

利用 hugo 进行生成网站的话其实挺容易入门的,基本按照 Quick Start 教程的话就可以搭建最基本的静态网站。

首先是下载 hugo,我是从起 github 项目空间中的 release 直接下载的。以下是一些最基本的命令:

生成一个网站:里边会包含 config.toml 配置文件,content 以装载你的文档,themes 来加载主题,public 下放置的是你生成的静态网站所有数据

1
hugo new site quickstart

下载一个主题到 themes 目录中,我目前用的是 hugo-theme-even

1
git clone https://github.com/olOwOlo/hugo-theme-even themes/even

修改配置文件:将 themes/even/exampleSite 中的 config.toml 覆盖 site 中的 config.toml 即可。

将你的内容放到 content/post 目录中,如果目录不存在则自己新建一个,其它主题可能使用的目录是 posts 而不是 post,这一点区别需要注意。

对网站进行调试:这样你可以在本机访问 http://localhost:1313/

1
hugo server -D

编译成静态网站

1
hugo -D

对于文档的内容可以在开头使用元信息指定 title, date, url 信息,这样就可以控制显示在页面标题和路径了,日期是用于归档排序的。如果不指定 url, hugo 将按照 content 下的目录相对路径去生成路径,参考 Override 路径。因为在 wordpress 中路径都是以 /index.php/{year}/{month}/{day}/{title}/ 的格式,所以我这里就沿用了之前的路径模式。

部署

比较简单,就是放到你的网站对外的目录即可。这里说贴一下 certbot 生成证书的命令:

1
certbot certonly -d mrlongx.com --manual --preferred-challenges dns --server https://acme-v02.api.letsencrypt.org/directory

按照提示的步骤去操作即可。当需要更新时也调用这个命令即可。