Wenxin Theme 介绍

doonly1 888 字

Wenxin Theme 是一个专为 Trilium Notes 设计的独立 Share 主题模板，由 Hugo 主题「文心 (Wenxin)」移植而来，追求极简阅读体验：中文优先排版、自动暗色模式、自托管字体、PJAX 无刷新导航。

主要特性

  • 极简阅读排版 — 中文优先，衬线正文 + 无衬线标题，行宽克制
  • 自动暗色模式 — 跟随系统 prefers-color-scheme，无需手动切换
  • 自托管字体 — Lora / EB Garamond / JetBrains Mono，全部本地加载，无外部请求
  • PJAX 无刷新导航 — 页面切换不闪烁，带进度条与过渡动画
  • Lenis 平滑滚动 — 桌面端丝滑滚动，触摸设备自动跳过
  • 文章大纲 — 右侧目录树 + 滚动高亮 + 移动端抽屉
  • 代码高亮 — Prism.js，自动跟随暗色模式
  • 数学公式 — KaTeX 支持（按需加载）
  • 评论系统 — Twikoo 支持（可选）
  • 移动端适配 — 单列布局，侧栏退化为顶部导航
  • 无障碍 — 减少动效 / 高对比度适配（WCAG）

技术栈

  • 模板引擎 — EJS（Trilium shareTemplate）
  • 样式系统 — CSS 自定义属性（设计令牌）+ 20 个模块化样式文件
  • 图标 — Phosphor Icons（内联 SVG）
  • 平滑滚动 — Lenis
  • 代码高亮 — Prism.js
  • 数学公式 — KaTeX（CDN）

快速开始

  1. 在 Trilium 中创建根笔记（如 Wenxin Notes），添加 #share、#shareRoot 标签
  2. 上传 Wenxin-Theme.ejs 为模板笔记（mime: application/x-ejs），CSS/JS/字体上传为对应笔记
  3. 根笔记设置 ~shareTemplate relation 指向模板，~shareCss / ~shareJs 按顺序关联资源
  4. 文章笔记打上 #date 标签（支持 #tag、#author、#summary 等）
  5. 完成！访问 https://你的域名/share/根笔记ID 即可

相关链接

  • Wenxin Theme 源码仓库 — 本项目 GitHub 仓库
  • 文心 (Wenxin) 原版主题 — Hugo 原始主题
  • Trilium Notes — 笔记应用本体
  • Phosphor Icons — 图标库
  • Prism.js — 代码高亮
  • KaTeX — 数学公式
  • Twikoo — 评论系统