theme-Serenity-Xmao：一个 Halo 主题

如果你正在使用 Halo 搭建个人博客，主题往往不只是“换个颜色”这么简单。

一个好用的主题，应该让访客能舒服地阅读内容，也应该让站长在配置、维护和扩展时少折腾一些。theme-Serenity-Xmao 就是在 Serenity 主题的基础上，结合个人博客的实际使用习惯完成的二次开发版本。

项目基于 Serenity-Grace 开发，保留原主题的页面结构、亮暗模式与后台配置能力，并针对友链、公告、移动端导航和主题细节进行了调整。

仓库地址：xmao-cell/theme-Serenity-Xmao
适用版本：Halo 2.27.2 及以上
开源协议：GPL-3.0

从普通用户的角度

对用户来说，博客最重要的还是阅读体验。

主题保留了亮色和暗色模式，页面在不同设备上都有对应的布局处理。文章页的封面、正文、信息栏采用统一的圆角卡片风格，移动端也针对长标题和文章信息做了重新排布，避免内容挤在一起。

首页、归档、标签、分类、友链、留言板等页面都有独立设计，但整体色彩和交互保持一致，不会让人感觉每个页面像是不同主题拼出来的。

移动端还提供两种导航样式：

  • 默认保留原有导航方式；
  • 可在主题设置中启用抽屉式导航，更适合菜单较多的网站。

对于访客而言，最直观的变化大概是：页面更容易看清、按钮更容易点到、手机上浏览也不会显得拥挤。

从站长的角度

站长真正关心的，通常是“能不能少改代码”。

主题的大部分内容都可以通过 Halo 后台配置，包括站点信息、首页背景、主题色、社交链接、首页模块、移动端导航等。即使不熟悉前端，也能完成基本的个性化设置。

友链页面以及移动端适配是这次二次开发重点调整的部分之一：

  • 支持显示名称、描述、链接、头像和 ICP 备案信息；
  • 头像地址会以完整 URL 输出；
  • 每一项信息可单独复制；
  • 支持一键复制全部本站友链信息；
  • 适配 Link Submit 友链申请插件；
  • 提供申请流程和审核要求展示。

这样在交换友链时，不需要再手动整理站点资料，访客也能直接提交申请。

公告插件适配

主题适配了 plugin-announcement 公告插件。

安装并启用插件后，可以使用主题提供的公告页面模板，也可以在导航菜单中添加公告入口。公告自动弹窗和详情弹窗会跟随主题的亮暗模式、主题色和移动端布局，不会显得像是额外拼接进去的组件。

同时，主题已适配 Halo 的页面布局契约。对于支持该契约的插件前台页面，会优先复用主题本身的页头、页脚、配色和响应式布局，而不是回退到 Halo 默认页面外壳。

从开发者的角度

这不是一个从零开始的新主题，而是在 Serenity 的基础上继续维护和扩展。

二次开发过程中，尽量遵循几个原则：

  • 不破坏 Halo 原本的主题配置方式；
  • 不把插件功能重新实现到主题里；
  • 插件未安装时，页面仍然能够正常展示；
  • 尽量让新增样式跟随主题已有的颜色变量；
  • 保持桌面端与移动端分别适配，而不是简单缩放。

目前主题已明确要求 Halo 2.27.2 及以上版本，并补充了 templates/layout.html 页面布局契约。这样，支持该契约的插件页面可以直接复用主题外壳，减少插件页面与主题视觉不一致的问题。

对于后续维护来说，这种方式也更稳妥：主题负责页面风格和布局，插件负责自己的数据与业务逻辑。

安装方式

  1. 前往 GitHub Releases 下载主题安装包；
  2. 在 Halo 后台进入「外观 → 主题」；
  3. 上传 ZIP 安装包并启用主题；
  4. 进入主题设置完成站点信息、背景和导航等配置；
  5. 上传或更新主题后，建议在主题详情页执行一次“重载主题配置”。

下载地址：

theme-Serenity-Xmao Releases

写在最后

个人博客不一定要做得很复杂，但应该有自己的样子。

theme-Serenity-Xmao 更希望提供的是一个可以长期使用的基础：日常写文章时足够安静，展示个人内容时足够完整，需要增加友链、公告或其他插件能力时也不用推倒重来。

如果你也在使用 Halo，欢迎试用、提出问题，或者根据自己的需求继续修改它。