绿野 Luye · Halo 2 主题
深绿玻璃拟态(Glassmorphism)风格的 Halo 2 博客主题。视觉语言移植自 Ron567 个人主页(aboutme):雾绿光晕背景、毛玻璃卡片、衬线大标题、胶囊按钮,以及标志性的晴 / 雨 / 雪 Canvas 粒子背景特效。
特性
- 深绿玻璃拟态设计:
#0E1F17 → #08120E渐变底色 + 雾绿光晕 +backdrop-filter毛玻璃卡片,与个人主页同源的设计令牌。 - 天气背景特效:导航栏可切换晴(光柱与浮尘)/ 雨 / 雪三种 Canvas 粒子背景,选择持久化到浏览器本地,尊重
prefers-reduced-motion。 - 完整页面模板:首页(Hero + 文章列表)、文章页(玻璃正文面板 + 目录样式排版 + 上下篇 + 评论区)、独立页面、文章归档(时间线)、分类/标签页、作者页、404。
- 「关于我」自定义模板:眉题 + 大标题 + 圆形玻璃头像徽章,复刻个人主页的 About 版式,在后台创建页面后可选用。
- 响应式:桌面三栏卡片网格到移动端单列自适应,移动端抽屉式导航。
- 主题设置:品牌副标题、Hero 文案与横幅图、主题强调色、页脚文案、字体加载开关等均可在后台配置。
安装
要求 Halo ≥ 2.26.0(使用了该版本引入的 layout.html 页面布局契约)。
- 将本目录打包为 zip:在
theme-luye目录的上一级执行zip -r theme-luye.zip theme-luye(确保 zip 内第一层是theme-luye文件夹)。 - 进入 Halo 后台 → 外观 → 主题 → 安装主题,上传 zip。
- 启用「绿野 Luye」,并在「主题设置」中按需调整后点击保存(修改设置后如未生效,点击「重载主题配置」)。
主题设置说明
| 分组 | 设置项 | 说明 |
|---|---|---|
| 基础 | 品牌副标题 | 导航 Logo 名称下方的小字,建议英文短语 |
| 基础 | 站长头像 | 用于「关于我」页、作者页与文章作者条 |
| 首页 Hero | 眉题 / 主标题 / 副标题 | Hero 区三段文案 |
| 首页 Hero | 横幅图 | Hero 底部宽幅意象图,可留空 |
| 首页 Hero | 主按钮文案 / 目标 | 默认「看看我的文章」,锚点 #posts |
| 外观 | 主题强调色 | 默认 #7DD9A6,全站强调色派生于此 |
| 外观 | 天气背景特效 | 关闭后导航栏不再显示晴雨雪切换器 |
| 外观 | 在线衬线字体 | 加载 Google Fonts;国内访问慢可关闭,自动回退系统字体 |
| 页脚 | 标语 / 邮箱 / GitHub / 版权文案 | 页脚信息与联系方式胶囊 |
页面建议
- 导航菜单:后台 → 外观 → 菜单,创建主菜单(首页 / 归档 / 分类 / 标签 / 关于)。
- 关于页:新建独立页面(别名建议
about),在页面设置中将模板切换为「关于我」。 - 文章封面:文章上传封面图后,首页置顶卡片与文章页头图会自动展示。
目录结构
theme-luye/
├── theme.yaml # 主题元数据
├── settings.yaml # 主题设置表单
├── screenshot.png # 后台主题预览图
├── logo.png # 主题 Logo
├── LICENSE # GPL-3.0 全文
├── templates/
│ ├── layout.html # 全局布局契约
│ ├── index.html # 首页(Hero + 文章列表 + 分页)
│ ├── post.html # 文章页
│ ├── page.html # 独立页面
│ ├── page_about.html # 「关于我」自定义模板
│ ├── archives.html # 文章归档(按年时间线)
│ ├── categories.html # 分类总览
│ ├── category.html # 分类文章列表
│ ├── tags.html # 标签总览
│ ├── tag.html # 标签文章列表
│ ├── author.html # 作者归档
│ ├── error.html # 错误页
│ ├── modules/ # 公共片段(页脚 / 分页 / 文章卡片等)
│ └── assets/
│ ├── css/style.css # 设计系统
│ ├── js/main.js # 导航 / 返回顶部 / 滚动显现
│ ├── js/weather.js # 晴雨雪粒子背景
│ └── svg/ # 叶片 / 山峰图标
升级
主题设置保存在 Halo 的 ConfigMap 中,升级不会丢失配置。在后台 → 外观 → 主题中找到「绿野 Luye」→ 升级 → 上传新版本 zip 即可;也可卸载旧版后重新安装(卸载前需先切换到其他主题)。已发布版本的制品不作修改,修复问题一律发新版本。
卸载
后台 → 外观 → 主题,先启用其他主题,再对「绿野 Luye」执行卸载。卸载主题不影响文章、页面、分类、标签等内容数据。
故障排查
- 设置不生效:主题设置页点击「重载主题配置」。
- 字体加载慢或样式异常:主题设置 → 外观 → 关闭「加载在线衬线字体」,自动回退系统字体(宋体/苹方)。
- 天气特效不显示:确认主题设置 → 外观 → 「启用天气背景特效」已开启;切换按钮在导航栏右侧;用户的选择保存在浏览器本地,重新点击可关闭。
- 评论区不显示:需安装并启用评论插件,且文章/页面开启了评论;未安装评论插件时评论区自动隐藏。
- 安装后页面报错:确认 Halo 版本 ≥ 2.26.0,本主题使用了 2.26.0 引入的
layout.html页面布局契约。 - 其他问题:请携带 Halo 版本与报错截图提交 Issue:https://github.com/ReganQing/Luye/issues
许可
GPL-3.0。设计与图标素材来自 Ron567 个人主页项目。

