前言
我写博客的初心很简单,一是一些软件的配置过程(防止第二次配置的时候又抓瞎);二是记录下一下自己学习过程中的一些心得体会,在 高乙超的博客 中,我曾经看到一句话,叫 "To learn, read; To know, write; To master, teach"。
过去二十年里,在学习的过程中,一直是作为一个输入方,应付考试倒是没啥问题,但也仅此而已了。为了更好地体会和领悟这些知识,我决定写写博客,既是做笔记,也是对自己的所学的一种整理和输出,也希望能有更多同道者看到,从而一起交流学习、共同进步。
最一开始么,其实是告诫自己,写博客的核心在于动笔输出,而不是折腾博客的主题又或是如何搭建博客站点,因此就想着选择一个现有的公开的博客平台,经过一番比较之下选择了博客园。说是比较,其实也没得太多选择的余地,除了博客园也就是 CSDN 了,然而对于 CSDN 我实在是深恶痛绝。博客园相较之下克制很多,广告少,更聚焦于技术,原创内容更多且更有深度,虽然界面以 2023 年的眼光来看比较老土了,但博客园支持自定义 CSS 啊。
没错,我还是无法控制自己,折腾了一下博客园的主题,鉴于本人对前端一窍不通,就算以后了解了,以我这种纠结来纠结去的性子,自己动手写主题,选择配色、主题、字号等绝对是噩梦,因此仅限于在 GitHub 上搜索他人做好的主题,挑了一番之后,网上比较热门的诸如 Silence 之类的主题,我都觉得太花里胡哨了,而且字体并不喜欢,找到一个设计风格不错的,奈何主题又太久没更新了,最后作罢。
最后,我还是选择了博客园自带的 Coding Life 主题,修改了一下代码块的 CSS,主要是改了代码块字体。
然而写了几篇博客之后,又发现博客园自带的编辑器太难用了。还是要自己现在本地用 VsCode 配合 Markdown Preview Enhanced 插件写好,再复制粘贴到博客园上发布,就觉得有点麻烦,倒不如用 Hugo 或者 Hexo 了,配置好之后,写好博客再敲一下命令就能搞定了。
于是我又动了用 Hexo 或者 Hugo 自己搭一个博客网站的念头,首先简单对比了一下,选择了 Hugo,比起 Hexo 来说,它性能高,配置起来更方便,Hexo 非常流行的 Next 主题我也并不喜欢,倒是 Hugo 的不少主题我非常喜欢,我个人在用的主题是 hugo-PaperMod 和 hugo-coder,没错,我一口气搭了两个网站,在我看来 hugo-coder 更好看一点,而 hugo-PaperMod 功能更为齐全,用的人更多,教程也更多。
两个博客网址分别是 zwyyy456.tk 和 zwyyy456.ml。
我这两个基于 Hugo 的博客可以说是纯白嫖实现的,域名是白嫖的 Freenom 的 .tk
和 .ml
域名,自动部署方案是基于 GitHub 和 Vercel 实现的,将本地修改同步到 GitHub 之后,Vercel 就会自动构建站点。
这个方案我用了快半年,总体上来说是很满意的,写起博客来非常方便,站点颜值也很高,唯一美中不足的是,Google 或者 百度基本没有人看,估计和用的白嫖域名有关吧,我也不懂 SEO 优化,也没时间折腾这些,还有就是没有评论系统(反正也没人看)。其实搭建好个人博客之后,我还是坚持用复制粘贴的方式把博客同步到博客园坚持了一段时间的,后来太懒了,作罢。
就在前两天,我在查找 C++ 的内存分布相关资料的时候,发现了博主 sinkinben 的这篇 文章,我承认,肤浅的我一下子被他的博客主题吸引到了(内容反倒是其次了),在他的博客中有给出他的 Github 链接,点进去一看,果然有他的博客园主题的 CSS 和 html 文件,更改了一下博客园主题,看了一下实际效果,果然很好看。于是,我那把文章同步发布在博客园的心又蠢蠢欲动了起来。
博客园同步脚本
其实我一直有在关注博客园的 VsCode 插件,也使用过,其实挺好用的,但是有一个非常致命的问题。那就是执行 hugo new xxx.md
生成的文档都会带有如下图的 Yaml Front Matter 信息,这些信息不属于正文内容,Hugo 会基于这些信息解析出本文的标题、所属分类、标签等信息。而插件在上传文章到博客园时,并不会解析或者去除这些信息,而是作为正文的一部分直接上传,GitHub 上已经有人提 issue 了,开发者也注意到了这个问题,但还没来得及修改。
因此,如果想便捷地同步文章到博客园,在插件开发者做出修改之前,我只能另寻出路。经过我的一番检索,我发现了一个基本符合我需求的发布文章到博客园的 Python 脚本,基础教程见该脚本的 GitHub 地址。
首先,需要执行 conda install markdown-it-py
和 conda install mdit-py-plugins
安装所需要的模块,
配置好脚本文件中对应的文章路径、MetaWeblog 账户信息之后,运行该脚本即可,运行时后面可以带一个数字作为参数,表示一次更新或者发布多少文章,脚本会自动发布指定数量的最近修改过的文章到博客园,如果未指定则参数默认为 $1$。
注意,运行脚本时,如果碰到 Yaml Front Matter 部分的 tags 一栏为空的 .md
文件,脚本会直接结束运行,同时 Hugo 限制了 _index.zh.md
不能有 tags 这一栏,因此要特别作一点处理。
以 tech
目录下的文章为例,我写了一个简单的 shell 脚本,自动复制 tech/*.md
文件到 CnblogPy/tech/
下,然后删除该CnblogPy/tech/
下的 _index.zh.md
文件,脚本的文章路径也指定成 /home/Documents/zwyyy/zwyb_blog/CnblogPy/tech/
。
# update to cnblogs
cd ~/Documents/zwyb_blog
cp ./content/posts/leet/*.zh.md ./CnblogPy/leet/
cp ./content/posts/tech/*.zh.md ./CnblogPy/tech/
cp ./content/posts/blog/*.zh.md ./CnblogPy/blog/
rm ./CnblogPy/*/_index.zh.md
python3 ./CnblogPy/blog_posts.py 12
python3 ./CnblogPy/leet_posts.py 12
python3 ./CnblogPy/tech_posts.py 12
# update to my own blog site
git add .
git commit -m "mac, blog"
git push -u origin main
cp -r ./content/posts/tech ~/Documents/papermod/content/posts/
cp -r ./content/posts/blog ~/Documents/papermod/content/posts/
cp -r ./content/posts/leet ~/Documents/papermod/content/posts/
cp -r ./content/posts/tech ~/Documents/hugo_coder/content/posts/
cp -r ./content/posts/blog ~/Documents/hugo_coder/content/posts/
cp -r ./content/posts/leet ~/Documents/hugo_coder/content/posts/
cd ~/Documents/papermod
git add .
git commit -m "mac, papermod"
git push -u origin main
cd ~/Documents/hugo_coder
git add .
git commit -m "mac, hugo_coder"
git push -u origin main
修改主题
博主 sinkinben 制作的主题已经非常完善了,我主要是针对自己需求修改了一下 header.html
。
一是将 Home、 Email、 About 这三个 menuItem
对应的链接修改为自己的相关链接,而是添加了 ️ Tag 和 Category 以及相关的 subMenuItem
链接,并将头像换成了自己的。