博客主题：Trilium X Akari 博客主题使用介绍

2025-09-12

- 字

前言

一个0代码基础的咸鱼，在AI-chat的帮助下历时整整3个月（几乎将我所有玩游戏的时间都贡献出来）。今天（2025/11/16）这个博客主题总算正式发布了☆*: .｡. o(≧▽≦)o .｡.:*☆

🎉主题名为：Akari's -Theme 。

注意：本主题是基于 Trilium Notes v0.63.7 版本进行完美测试适配，最新版Trilium Next不一定完全可用。
本博客主题：基于© shmaur ｜ © 东东分享的trilium博客主题 Ankia、WhiteMinimalist 进行调试修改。

作者：Akari_404

版本：v1.1

预览Blog：阿卡林の笔记 (aiphm.cn)

GitHub地址：https://github.com/march-7th-mini/Trilium-X-Akari

👉主题附件下载：Akari's Blog (V1.1_20251121).zip

使用方法

下载附件，
运行Trilium Notes，
右键左侧树导航，
导入到笔记（取消勾选安全导入），

按F5或ctrl+r刷新页面。
将「Akari's Blog」笔记 -“基本属性”下的【分享】开关打开，即可访问博客界面预览。

注意：
导入数据前，最好提前备份数据，防止意外导致数据文件损坏，数据文件存放路径详见这篇文章-其他参考设置建议第6条。
导入成功后，会出现如下图的目录结构笔记。（此为博客基础的结构，除非你清楚、能修复修改带来的问题！否则别动。|ʘ‿ʘ)╯）
默认结构
这里结构别动
笔记名称可改

Akari's -Theme主题特点

1. 全局配置与 SEO
- 读取站点/博主元数据（名称、头像、关键词、备案号等）
- 自动生成各页面 SEO Meta、share-Card、robots、canonical 链接
- 接入网站管理员设置。让搜索引擎爬取（百度/必应/Google）及 Umami 无 Cookie 站点访问统计
2. 主题样式与脚本资源管理
- 动态注入 CSS/JS（highlight、mathjax、viewer、twikoo、折叠、蒙版调色盘、BGM、特效、kimi-chat等）
- 按需加载第三方库：force-graph、Sakana! Widget、Twikoo 评论系统、OwO 表情增强等
3. 自适应导航栏
- PC 端：LOGO、主菜单、下拉子菜单、一键展开“全部菜单”（含最近访问记录）、搜索
- 移动端：抽屉式菜单、搜索按钮、菜单切换按钮
- 自动高亮当前页面、外链新窗口、最近访问 localStorage 记录与回写
4. 多维度侧边导航（非首页）
- 树状/标签/分类三种维度目录，支持实时搜索、全部展开/折叠
- 目录节点自动生成锚点，点击自动路由并定位
- 修复移动端首次点击失效、自动滚动高亮当前标题
5. 页面大纲（TOC）与信息卡片
- 自动提取 h1-h6 生成层级目录，同步滚动高亮
- 信息卡片：博主信息、公告、推荐阅读、文章分类、标签云、最新评论、说说
6. 内容区核心功能
- 文章页：自动生成标题、作者、日期、字数、阅读量、标签、版权声明显示
- 文章卡片：置顶、摘要、头图、分类、标签、相对时间、外链识别
- 自定义页面：友链、归档、标签云+知识图谱可视化
- 代码块：行号、语言修正、代码块可折叠
- 媒体增强：图片点击放大、MP4视频自动替换为可控播放器、数学公式 MathJax 渲染（汉化MathJax右键菜单）
- 打赏模块：微信/支付宝收款码弹窗
7. 交互与体验
- 返回顶部、目录/大纲折叠按钮、悬浮提示；打磨细节，优化多个影响体验的小bug，更好的界面排版，更生动的元素。
- 智能导航栏（向下滚动隐藏，向上滚动显示，默认注释未启用）
- 首页随机语录+气泡+霓虹字特效、彩色飘带背景、蒙版调色盘
- 背景音乐
8. 扩展钩子
- header 预留插入点，方便不改动模板即可追加 meta、link、script，超详细的中文注释与分组方便二次迭代。
9. 兼容
- 打磨移动端细节，移动端优先响应式，兼容主流现代浏览器，优化了细节bug。