写了一个自己的 Hexo 博客主题:FEBIRDY
一、写在前面:为什么又折腾了一次博客主题
之前搭 Hexo 博客时,我用的是 Aomori。它本身已经能满足基本使用,但我对自己的博客还有一些具体想法:希望整体是深色背景,配一点青蓝色的强调色;首页不要太拥挤;文章页要适合中文长文阅读;分类、标签和归档页也要保持同一套视觉风格。
这些要求零零碎碎地改也能完成,但改到后面,样式和模板会越来越散。正好最近经常用 Codex 做开发工作,我就想着,干脆把这些想法整理成一个独立主题,给自己的博客换个样子。
二、FEBIRDY 是什么
FEBIRDY 是我给自己的 Hexo 博客做的一套主题,项目地址放在 GitHub:
它是基于 Aomori 1.36.0 逐步改出来的,保留了原项目的 MIT 许可证和来源说明。当前版本是 0.1.0,主要还是服务我自己的博客,优先照顾中文文章、日常写作和长期阅读体验。
它目前没有发布到 npm,使用时可以直接克隆到 Hexo 的主题目录:
1 | git clone https://github.com/sandy1108/hexo-theme-febirdy.git themes/febirdy |
然后在站点的 _config.yml 里指定:
1 | theme: febirdy |
三、我主要调整了哪些地方
这次没有追求做一个功能特别多的主题,主要就是围绕自己每天会看到的几个页面来改。
首页重新整理了文章列表、摘要、分类和标签的显示方式,让它看起来更像一个正在持续更新的个人博客。文章页重点调整了正文宽度、标题层级、代码块和段落间距,尽量让长一点的中文文章读起来不累。归档、分类、标签、关于页和 404 页也统一了颜色、卡片和侧栏样式。
主题还保留了浅色、自动和深色三种模式。虽然我自己大多数时间还是用深色模式,但把切换能力保留下来,别人拿去使用时不至于只能接受我的个人偏好。
移动端也专门看了一遍。它没有和桌面端完全做成两套界面,主要是把侧栏、文章宽度、分页和按钮间距重新调整了一下。手机上能正常看文章,对我来说就达到目标了,暂时没有继续追求特别复杂的移动端交互。
四、最后晒一下效果
现在这套主题已经在我的博客上使用,首页、文章页、归档页、分类标签页和移动端都有对应的页面效果。
它更适合喜欢深色界面、经常写中文技术文章、又希望自己调整博客细节的人。如果你只是想找一个开箱即用、配置项非常成熟的 Hexo 主题,那它目前还不一定合适,毕竟很多细节仍然带着我自己的使用习惯。