首先要感谢原博主折影轻梦编的Nexmoe。

这篇写清楚我到底改了哪些地方、为什么改，以及踩过的坑。

关于这个二改版

二改内容清单（共 9 项）

一、阅读体验

1. 首页摘要截断

原版首页用的是 $this->content('')，那个空参数不是字数限制，是「阅读全文」链接的文字。Typecho 的 content() 只认正文里的 <!--more--> 标记 —— 你没写标记，它就输出全文，文章一长列表页就变成一堵墙。

现在改成按字数截断，后台可配：

• 「首页文章摘要字数」默认 150，填 0 = 不限制（输出全文）
• 「摘要后面的链接文字」默认「阅读全文」，留空则不显示链接
• 文章里如果写了 <!--more-->，优先用标记前的内容

2. 头图高度压缩

原版头图高度写死而且很高，遇到竖版大图还会被撑得更高。现在：

• 首页与文章页头图统一 190px，手机端 150px
• 图片改用绝对定位 + object-fit: cover，无论原图多大（1080×1920 也一样）都裁在框内，不会再把版面顶开

顺便说个坑：这个修复卡了好几天，因为我一开始把 CSS 选择器写成了 #nexmoe-content .nexmoe-single ...，而 nexmoe-single 这个类其实在 <body> 上、是 #nexmoe-content 的父级不是子级 —— 祖先不等于后代，选择器一次都没匹配上，规则从来没生效过。改对之后一测，容器从 500px 立刻变成 190px。教训是：改样式前先确认那个类到底在 DOM 的哪一层，别凭感觉写选择器。

3. 文章目录树（全新功能，替代原版自带的目录）

原版自带一个右侧目录，但那条 .nexmoe-fixed 是 position: fixed; top: 0; height: 100vh; z-index: 1000，而且整份 post.php 里一条媒体查询都没有 —— 也就是说它在手机上也照样显示，还会从屏幕最顶端盖住正文。这是原版的设计缺陷。

我重写了一套：

• 按正文里的 h1 ~ h4 自动生成层级目录
• 样式：圆点 + 同级竖连线 + 层级缩进，圆点与连线都跟随主题色（改主题色目录会跟着变）
• 点击平滑跳转到对应小节；鼠标悬停变色、圆点放大
• 滚动时自动高亮当前所在小节
• 手机 / 平板不显示，桌面窄屏会自动把正文略微收窄，为目录腾出空间（笔记本 150% 缩放也能看到）

二、封面图

4. 封面图地址池（原版没有的新功能）

这个功能是我自己加的，起因是发现一个很典型的现象：每篇文章的封面图都一样。

查下来原因很直接。原版逻辑是「每篇文章手动设封面，否则全用同一个默认图」：

<?php if ($this->fields->Cover) { ?><img src="...Cover"><?php } else { ?><img src="<?php echo $this->options->background ?>"><?php } ?>

没给文章单独设封面时，所有文章输出的 URL 完全相同（比如 https://api.xxx.com/api）→ 浏览器只请求一次，剩下几处直接复用同一张图。不是 API 的问题（实测连请求 4 次返回 4 张不同的图）。

现在后台新增「封面图地址池」，一行一个地址，想填几个填几个：

https://picsum.photos/seed/{cid}/1200/600https://你的随机图API地址

• 按文章 ID 轮流取用 → 每篇文章封面都不同，而且同一篇永远是同一张（刷新不会乱变）
• 用「轮流」而不是「真随机」是真随机会导致同一篇每次刷新都换图，看起来很乱
• 地址里支持 {cid} 占位符，会被替换成文章 ID
• 留空则只用「博客默认封面图」
• 每篇文章仍可在「编辑文章 → 自定义缩略图」里单独指定，优先级最高

5. 图片加载失败自动隐藏

随机图 API 偶尔返回坏图或超时，现在封面加载失败会自动隐藏，不会出现破图图标。

这里也踩了个坑：一开始写的是无条件 onerror 隐藏，结果首页封面全变成空白灰块。原因是懒加载插件会把 src 挪到 data-src 并清空 src，而 src="" 会被浏览器当成「当前页面地址」去请求 → 失败 → 触发了我的兜底。改成 if(this.getAttribute('src')) 只在真的请求过图片时才处理就好了。

三、评论与通知

6. 评论头像改造

原版的评论头像依赖第三方服务 avatar.dawnlab.me，这个服务已经停止服务了，所以所有人的评论头像都是破图。现在改成三级回落：

有个实测数据值得记：gravatar.com 官方域名在国内是打不通的（HTTP 000），必须走国内镜像。另外 QQ 头像接口只接受固定尺寸（40 / 100 / 140 / 160 / 640），传 96 会返回 400 → 裂图，这个也一并处理了。

四、外观与配色

7. 配色可配置

原版把主题色 #ff4e6a 写死在几十处。现在全部改为 CSS 变量（定义在 :root，所以固定定位的目录也能继承），后台可配三项：

• ① 主色（链接、标签、按钮等）
• ② 侧栏当前页颜色
• ③ 侧栏悬停颜色

留空即沿用原版配色。

8. 暗色模式补齐

这个主题的暗色模式是整张替换样式表（换 CSS 文件、不加 body 类），所以新增的目录树样式必须写两份。我踩过这个坑：只在亮色版加了样式，暗色下目录是白的看不见。

五、性能与维护

9. 静态资源防缓存

CSS / JS 自动附带 ?v=文件修改时间，改完样式刷新即生效，不用再让访客手动强清浏览器缓存，后台还有个「手动刷新缓存」输入框兜底。

这个功能是被逼出来的：原主题引用 CSS 时完全没有版本参数，浏览器缓存后即使服务器上的文件改了也继续用旧的那份，导致「明明改了样式却没效果」，头图高度那个问题反复折腾了好几轮就是这个原因。Typecho 核心自己也不给静态资源加版本号，所以这在 Typecho 里是常态，不是主题的 bug。

安装

1. 解压后把 SuNexmoe 文件夹放进 Typecho 的 /usr/themes/ 目录
2. 后台 → 外观 → 启用
3. 务必去「外观 → 设置」点一次「保存」 —— 二改新增的配置项要保存一次才会生效
4. 建议在「设置 → 阅读」里把「每页文章数目」设为 20

致谢与协议

• 原主题 Nexmoe 由 折影轻梦 开发：https://github.com/nexmoe/typecho-theme-nexmoe
• 原主题许可为 Apache License 2.0（见主题内 LICENSE），版权归原作者所有，此处原样保留
• 本二改版 SuNexmoe 由 苏的碎碎念 修改，同样以 Apache License 2.0 授权发布（见主题内 LICENSE-APACHE）

欢迎使用、交流。QQ：2404999487