Back
Featured image of post 关于我想关闭博客但是写主题停不下来这件事

关于我想关闭博客但是写主题停不下来这件事

又到了一(三)年一度的写主题环节

最后一次认真地去写博客主题似乎是在三年前了,当时写了一款名为 Yellow 的 Hugo 主题。后来好像是厌倦了静态博客(?),然后就跑去 WordPress 了。

去年暑假也开工写过一款 WordPress 主题,名为 Malibu 。首页和文章页面都已经完成,很可惜最后没有坚持下去。今年本来想把它完成,git clone 仓库后发现都跑不起来了 (Composer 依赖问题),我也没有处理过这方面问题的经验,作罢。

今年暑假开始后(七月九号)并没有写主题的打算,而是想写一个评论系统,方便以后转移到静态博客上。也借此过程学习下 Typescript(在学校写了一年 C++ 想换换口味了) 和 MongoDB。写了三天后后端部分差不多完成了基础的功能,热情也有点褪去了,就开始准备月底的驾照笔试。

起稿

笔试结束后再一次无事可干,就有了写主题的冲动(评论系统挖的坑都还没填完呢喂喂)。开始学习如何用 Figma 打设计稿,大概过了两天后有了第一版稿子,能看到以前写过的主题的影子。

第一版设计
第一版设计

博客平台选择了以前用过的 Hugo ,因为熟悉其操作方式,而且最新版加入了 Typescript 支持,可以直接编译出浏览器可用的文件(import module 也会处理)。这样我也不用自己费心思去搞一套开发环境,方便许多。

又过了两天,把首页和文章页写出来后发现这个设计在小屏幕上(<= 笔记本)上还算凑合能看,大屏幕上(27寸4K 150% 缩放)太多留白了,强行拉大后不好看。于是着手开始规划第二版设计,改成三栏布局(大屏幕当然要利用起来),也就是现在的设计。

第二版设计
第二版设计

第二版设计吸取了之前的教训,考虑到了主流设备(手机、平板、电脑)上的布局。也设计了夜间模式,归档,搜索等之前没有考虑到的地方。内容填充使用了自己博客的文章,这样代码写出来后差距不会那么大。

上线

星期六大概完成了基础框架,目前还缺少的功能有:

  • 搜索页面
  • 夜间模式
  • 侧边栏部分小部件(分类,归档…)
  • 评论系统(咕咕咕

星期日早上开始准备上线,把开发时候用到的各类无用代码删除后部署到了 Netlify 上。本来应该再等等的,但折腾了快十天,有点累了,想休息一段时间后再继续。(好久没和好友打游戏了

目前主题还有很多问题,尤其是元素命名方面,实在是太脏了:有的地方使用了两个横杠,有些地方一个。当时写代码的时候没有想很多,随便起个名字就好了,就弄了一座屎山出来。

同时在字体方面也需要继续修改,我不是很喜欢现在的显示效果。一开始引入了 Noto Sans SC,但感觉对页面加载速度影响较大就取消了。首页的文章展示方式也需要修改,目前在大屏幕上留白过大,看起来很不和谐。

这次写主题也学习到了很多新的东西,可以几篇文章:

  • 如何优雅的在 Hugo 上实现图片懒加载(无布局抖动)
  • 如何用歪门邪道在 Hugo 文章内插入相册

最后

从 2013 年折腾博客到现在也写了好几款主题了,印象最深刻的还是几年前在 Ghost 平台发布的第一款付费主题。虽然没有卖出去几份(个位数),但当时并没有给这款付费主题应有的对待,后期也没有更新过,想起来就觉得不妥。这次写这个主题也是为了这件事,打算把主题完善过后发给这几位曾经支持过我的人们。

现在写主题主要还是为了满足我自己折腾的欲望,也感谢自己这么多年来还没丧失这方面的兴趣。暂时不知道会不会把这个主题公开发布。

另外,目前博客还没上线评论系统。不过这破博客从今年四月份到现在都没收到过一条评论,也没什么关系吧。等写好了评论系统的前端后再上线(🕊️🕊️🕊️)。

标题是 iKirby dalao 起的

2020/08/12 更新:评论系统上线了,目前还很简陋,很可能会触发奇怪的 Bug。

Licensed under CC BY-NC-SA 4.0
638 views