Featured image of post WingerBlog4来了

WingerBlog4来了

又一次更新!也不会是最后一次!

每一个博客注定的宿命就是被一遍一遍的改来改去。在一年没有发过博客之后,我又一次把黑手伸向了那片空间……

这篇博客介绍了WingerBlog 4最大的两处升级:原生多语言支持和密码隐藏博客内容,并详细罗列了这次迁移过程中遇到的问题。

原生多语言支持

原生多语言支持是促使我最终决定升级至最新版Stack的最大动力——虽然这个更新是Hugo的更新。总之,现在同一篇Blog可以有不同语言的版本,侧边栏也可以轻松切换语言了。

然而这个小小的实现差点把我折腾吐血。Stack并没有在标准模版里支持多语言,导致我必须自己一步一步摸索。最终我几乎整个重写了config.yaml里面关于languages的全部内容(照搬了WingerBlog3.0),并且用了很多只能说hack的方法。

实践证明自带模版里的多语言与hugo兼容并不好,经常出现网站跳转混乱、各个东西无法控制的情况。最终,我依旧指定生成了中文英文对应的两个contentDir,并指定了对应的baseurl。只有这样才能保证网站访问正常。同时,我分语言分别指定了menu bar item,才能在中英文网页上对应显示正确的首页图标。

但指定url之后,访问blog.winger216.bid就会直接提示404了。解决的方法是在nginx的配置文件里重定向访问到/zh-cn/;我知道这很hack,但是它能用。

密码隐藏博客内容

从他第一天给我展示开始,我就一直想要midstream.cn那种密码隐藏博客功能。今天我终于借助hugo-encryptor实现了。这个插件可以提前在内容中插入shortcode的方式标记需要被隐藏的内容,然后用一个外置的python脚本加密生成好的site文件。是的,就是这么hack。

这个插件与Stack的配合不是很好:Stack自带的搜索功能和RSS都无法被python脚本加密。RSS我直接在config里限制生成了;但我对搜索功能没有什么思路。理论上来说,你现在可以通过搜索功能看到我所有的加密内容。我想,可以通过自己更改encryptor的shortcode部分,将部分内容隐藏起来;也可以干脆整个ban掉搜索功能。但从另一个角度来说,我加密内容主要是为了隐藏插在里面的照片,文字本身不是什么需要注意的大问题。

此外,这个插件在网页上解密时需要一个decrypt.js的脚本,默认情况下是写在绝对路径里的;然而在contentDir的多语言设置下,hugo会默认生成两个网站,所有的static文件会被放到这两个文件夹里!最终,我从hugo-encryptor得到了灵感,决定直接手动拷贝一份文件放到最终的public文件夹下。虽然非常hack,但是能用。顺手给网站加了个icon。

最终的效果如下所示:(密码:123456)

文章的部分内容被密码保护:

一些小修小改

新博客的最后一步便是将Stack的版面排列修改回旧版。新版Stack的卡片太宽太大,属于是扬短避长了。具体内容全部参考的这篇文章

同时,目前新的Waline评论系统也没有布置好(旧Waline的一个库挂掉了,需要重新部署),新的Auto-Deploy系统也没有测试。这些都是需要慢慢折腾的东西啦。

不过我现在是不想折腾了。先多发几篇博客才对!


本次更新的参考资料:

Hugo Stack主题更新小记

Hugo博客 | stack主题修改第一站

Hugo文章加密

Li4n0/hugo_encryptor (吐槽一下,这个中英文文档内容完全不一致,根本不知道应该参考哪个)

Multilingual Mode

Widgets not visible when zoomed in 100% (调整版面时一开始往这个方向去了,结果浪费了两三个小时。如果一开始能想起来custom css就好了。)

Built with Hugo
主题 StackJimmy 设计