武侠梦 wuxiameng · Typecho 主题全解：一个主题，十四座江湖

飞雪连天射白鹿　笑书神侠倚碧鸳

作者：randaxia（https://daimarushi.cn）　版本：v1.6.2　适用：Typecho 1.1 / 1.2（PHP 7.2+）　授权：MIT

写在前面

你有没有想过：博客的「首页」可以叫「山门」，「分类」可以叫「江湖分舵」，「标签云」可以叫「兵器谱」，「上一篇 / 下一篇」可以叫「前尘 / 后事」，而 404 页面可以写上一句「此路不通 —— 前方是绝情谷底」？

武侠梦（wuxiameng） 就是这么一款主题。它以金庸先生十四部小说为骨架，把一整套博客界面译成了江湖语汇；一个主题之内，收入 十四套配色、十四种版式、十四重江湖气象——从辽东雪原的冷青，到大理佛国的绛红；从扬州市井的明黄，到光明顶圣火的橙黑。后台选一套默认风格，访客在页面上随手「换江湖」。

这篇介绍写给第一次用 Typecho、第一次换主题的新手：先说清它长什么样、能做什么、每个零件背后藏着什么讲究，再手把手带你把它装上自己的站。

一、它是什么：一款「移动优先、零外链」的国风主题

「零外链」不是口号，是实打实的好处：断网、内网、CDN 挂掉，页面照样完整好看；不加载第三方字体，没有字体闪烁（FOIT），也没有隐私合规顾虑；不用 Gravatar，评论头像由本站「江湖面具」分配，访客 IP 不外泄给第三方。

二、武侠的寓意：每个零件都有一个江湖的名字

一款主题「像不像武侠」，不看它贴了多少国风素材，而看它有没有把界面语言换掉。武侠梦把博客的每一个零件都译了一遍：

一句「飞雪连天射白鹿　笑书神侠倚碧鸳」，是金庸十四部书名首字的连读，也是这套主题的题词与骨架。

三、十四部小说，十四座江湖

后台的「默认江湖风格」是一个下拉框，选项格式为「风格首字-题词」，例如 飞-辽东月冷，药王谷深。首字连起来，正是那副对联。十四套江湖，各配一种版式、一种纸面、一种主色、一句题词，还各分配了几件「江湖物事」：

换风格 ≠ 只换颜色。选中某一套江湖，会同时切换三件事：① 配色（主色、辅色、纸面底色、印章颜色）；② 版式骨架（栏数、最大宽度、侧栏在左还是在右）；③ 纸面纹理（纸纹、雪点、石刻、沙痕、竹影……）。

四、外观：一座山门，怎样换出十四种门面

如果把一款主题比作一座山门，那么版式是院落的格局，纸面是墙上的肌理，物事是点缀在院里的器物，而门面则是它迎客时的样子。这四件事在武侠梦里各有一套配置，彼此搭配，才凑出十四座不一样的江湖。

先说版式。 十四套江湖各有一种骨架：有的是经典双栏（classic），有的是通栏宽幅（wide）；连城诀排得密（narrow），天龙八部走杂志式（magazine）；射雕英雄传一进门就是首屏题壁（hero），白马啸西风则收成居中散文的窄栏（prose）；鹿鼎记铺开卡片网格（grid），笑傲江湖索性极简留白（minimal）；书剑恩仇录在左侧立一书目栏（split），神雕侠侣干脆沉入玄夜（dark）；侠客行做碑刻质感（stele），倚天屠龙记斜切横幅（banner）；碧血剑是时间轴（timeline），鸳鸯刀左右对称如双刀（duo）。栏数、最大宽度、侧栏位置，随骨架一起变。

再说纸面。 六种纹理——纸纹 paper、雪点 snow、石刻 stone、沙痕 sand、竹影 bamboo、布纹 grain——全部由 CSS 渐变画出，不请求任何图片。它决定的是「这座江湖的底子摸上去是什么手感」。

然后是物事。 十四件小景全由纯 CSS 绘制：山水、水墨、夕阳、树、船、瘦马、鸟、客栈、酒招、书卷、刀、剑、火把、人物剪影。分配思路是跟着小说的意象走：大漠（射雕、白马）配瘦马与夕阳，终南玄夜（神雕）点火把、放飞鸟，竹林琴箫（笑傲）植竹展卷，书剑恩仇（书剑）自然刀剑加书卷，圣火光明顶（倚天）举火把、染晚霞。远景压低、近物贴边，文字始终居中可读。

最后是门面。 页头的三个零件（旗号 / 检索 / 导航）只靠重排，就有十四种迎客的样子：射雕是「居中题名＋弓形药丸检索＋虚线题壁导航」，侠客行把题名嵌进碑框，书剑在旗号旁立一道朱栏，碧血的导航是一条带节点的刻度线……换江湖即换门面。

五、功能亮点逐条看

武侠梦的功能不少，与其一条条念参数，不如按用的人是谁来分三组看：访客在前台看到什么体验、内容以什么形态呈现、站长在后台能掌握哪些能力。

先说前台体验。 最亮眼的是「换江湖」：后台「默认江湖风格」下拉框定站点默认，前台右缘一枚竖排「江湖令」浮标，点开是一册「名册书页」——14 条竖排条目写着色点、汉字序号、小说名、题词，当前项标「在此」，底部三键是随机换江湖 / 回到默认 / 收起名册。选择记在访客自己的浏览器里，不写数据库、不影响站点默认值；任意页面地址后加 ?skin=xiao 可直达指定风格（key：fei xue lian tian she bai lu xiao shu shen xia yi bi yuan）。搜索也在这一层：搜索框按钮是一个「寻」字，提交时直达 Typecho 核心搜索路由 /search/关键词/，绕开「POST 首页 → 302」那道中转——首页被 CDN 或缓存插件缓存时也能正常搜出结果。

再说内容呈现。 列表条目是「卷轴卡片」（印章字头＋日期＋分舵＋跟帖数）；开启缩略图后变「左图 · 右文」，图的轮廓由 SVG 遮罩剪出（内置题壁匾额 / 立轴画卷 / 单刀斜刃三款）。至于缩略图从哪来，主题会依次去找：自定义字段 thumb/cover/image、正文第一张图、附件，最后兜底为题名首字印章；它认得 Markdown、<img>、懒加载写法与相对地址，并会智能跳过表情、头像、1×1 像素与占位图（v1.6.1 起生效）。想确认某张图是哪种来源，加 ?wxmthumb=1 即可在图上看到来源角标（field/content/attach/seal）。

评论与头像另成一味。楼层用汉字计数；头像不再走 Gravatar，改为本站 55 枚江湖面具——由「面形 × 眼式 × 额纹 × 唇式 × 颊纹 × 单字印」组合，内联 SVG 绘制，随江湖主色变色。面具按「尊号」哈希（crc32(昵称) % 55）稳定分配，同一昵称永远同一枚；留言框上方可「挑一枚面具」自行试戴，结果记在访客浏览器里；另有「面具谱」独立页面可一览试戴。

两个独立页面模板也让内容更成体系：友链页选「友情链接」模板，正文按 名称|网址|描述|头像 一行一个，自动排成卡片式名帖（朱砂印首字、双框名帖、云纹角花、「山门」腰牌、汉字编次），单列 → 双列 → 三列自适应，且卡片区下方不再重复一遍文字链接；关于页选「关于」模板，顶部是一张「立传卡」（站点面具＋站名＋旗号＋简介），底部三枚按钮：回山门 / 友情链接 / 面具谱。侧栏则由六个模块组成：坐馆人、门派榜、江湖分舵、新近纪事、兵器谱（标签云，最多 30 个）、岁月卷。

最后说后台能力。 字体有一套现成的搭配：松风竹影 / 手书侠客行 / 碑刻玄铁令 / 书剑公文 / 素笺小楷 / 玄夜黑玉砚 / 玉笛圆润篇 / 天机秘籍谱八套方案，外加一个「自定义」（九款中文字族自由搭配），并可按喜好调正文字号（四档）与行距（三档）；九款字族全部取设备自带字体，不加载 webfont。此外还有两处用心：一是「安定库」，Typecho 内核换主题时会删掉 theme:主题名 设置行，因此任何主题都会「设置回到默认」，武侠梦把设置另存进一行不带 theme: 前缀的「安定库」，内核删不到它，换回来时自动回种；二是整页滚动条换成了与「换江湖」名册同款的竹节样式（轨道透明、滑块取「主色 → 辅色」渐变、细圆头），随江湖主色换色。

六、手把手安装（小白版）

第 0 步 · 准备：一个跑起来的 Typecho 站（1.1 / 1.2，PHP 7.2+）；下载 wuxiameng 主题包并解压出一个 wuxiameng 文件夹。

第 1 步 · 上传主题：方式 A（推荐）后台 → 控制台 → 外观 → 「添加主题」→ 选压缩包 → 上传；方式 B 用 FTP / 文件管理器把 wuxiameng 文件夹放进站点的 /usr/themes/，正确路径是 /usr/themes/wuxiameng/style.css。

第 2 步 · 启用：后台 → 控制台 → 外观，找到「武侠梦 wuxiameng」，点启用。

第 3 步 · 选风格、填文案：点设置外观，「一 · 江湖风格」选默认江湖（默认为「笑傲江湖」）；「二 · 山门与文案」填副标题、自定义菜单、页脚题词；其余留空即用默认。

第 4 步 · 建独立页面（可选但推荐）：新建「关于」(about，模板选「关于」)、「友情链接」(links，模板选「友情链接」，正文按 名称|网址|描述|头像 一行一个)、「面具谱」(masks，模板选「面具谱」)。

第 5 步 · 收尾：清一次站点缓存 / CDN；手机、电脑各开一次，确认换江湖、搜索、评论、友链卡片正常。

想先看效果再动手，也可以直接打开 Demo：它把上面说的换江湖、卷轴纪事、名帖友链、面具分配与十四部一览都做进来了，比对着看会更容易上手。

七、后台设置一览

八、常见问题

装完之后遇到的多数不是「毛病」，而是配置没到位。这里挑出最常被问到的五件事，逐个说清。

Q1 换风格后「掉样式」？ 多半是缓存，清 OPcache / CDN 后强刷。

Q2 评论提交后不显示？ 主题已修复该问题：根因是 Typecho 1.2 的防垃圾令牌按 respondId 找不到回批框，令牌塞不进去导致批注未入库。可对照检查回批表单 id 是否为 respond-<类型>-<cid>、表单是否带 input name="_" 令牌。

Q3 缩略图全是印章？ 加 ?wxmthumb=1 看来源角标；若为 seal，检查「取图来源」是否为「只认自定义字段」、图片名是否被排除词命中。

Q4 侧栏出现滚动条？ 侧栏吸顶模块已隐去滚动条，滚轮与触摸照旧可滚。

Q5 想加自己的配色？ 在 inc/skins.php 的 wxm_skins() 追加一项，再到 assets/css/skins.css 按 [data-wxm-skin="你的key"] 写一套变量即可。

九、版权与致谢

• 主题作者：randaxia（https://daimarushi.cn）
• 授权协议：MIT —— 可自由使用与二次开发，请保留页脚署名与作者链接。
• 十四部小说书名及人物名称，著作权归金庸先生及其权利人所有；本主题仅在视觉与文案上致敬，不包含任何原文内容，请在使用时一并尊重原著版权。

一个主题，十四座江湖。
愿你的山门，常年有人来。