喜欢 Typora 的阅读效果,也想让「本地 Markdown → WordPress → 知乎」这条写作流程少一点折腾。
最近,我给自己的博客换上了一个新主题:Paddy Newsprint。
它并不是从一个宏大的产品计划开始的。最初的出发点很简单:我喜欢 Typora 打开 Markdown 后的阅读节奏,也习惯在本地写文章。但文章写完之后,还要在不同平台之间来回复制、调整格式,公式和 Mermaid 图表尤其容易把流程打断。于是我想,不如做一个更贴合自己写作习惯的 WordPress 主题。
我的日常写作流程
平时写博客,大致是这样一条链路:
- 在本地用 Typora 写 Markdown;
- 将文章复制到 WordPress 站点;
- 再把内容复制到知乎;
- 维护公式、代码块、表格和 Mermaid 图表等格式;
- 发布之后,再检查各个平台的显示效果。
这套流程本身并不复杂,但它有几个很具体的麻烦。
首先,WordPress 主题和插件对 LaTeX 公式的支持经常需要额外配置。有的方案依赖短代码,有的方案要求改写公式,有的方案在编辑器、前台和 RSS 中表现不一致。其次,Mermaid 在很多网站上不能直接按照 Markdown 代码块渲染,往往需要先转成图片,再上传到文章里。最后,文章一旦离开本地 Markdown 文件,原文就不容易被完整保留下来。
我希望主题能尽可能接近这样的使用方式:本地按照自己熟悉的 Markdown 习惯写,粘贴到 WordPress 后仍然能正常阅读,并且随时可以拿回 Markdown 原文。
为什么是「报纸风格」
功能问题解决之后,剩下的是视觉问题。
我一直很喜欢报纸版面那种高密度的信息组织方式:明确的栏线、紧凑的留白、强烈的标题层级,以及在有限空间里同时容纳多条信息的能力。它不像一些极简主题那样追求把页面变得空无一物,而是允许内容之间产生有秩序的拥挤感。
所以 Paddy Newsprint 最后变成了一个报纸风格的块主题:
- 首页采用报头、栏目、主稿和侧栏组成的报纸版面;
- 文章页保留接近 Typora Newsprint 的阅读节奏;
- 颜色、字体、字号和间距通过
theme.json统一管理; - 尽量使用 WordPress 原生区块,让页面可以继续在站点编辑器里修改;
- 中文内容强调稳定的阅读宽度,英文内容则使用更接近报刊排版的字体方案。

我希望它看起来像一份可以长期阅读的数字报纸,而不是一张只负责展示链接的首页。
公式、Mermaid 和 Markdown 原文
这个主题最核心的改进,还是围绕 Markdown 内容本身。
LaTeX 公式
文章中的行内公式和独立公式可以直接保留 Markdown 写法。主题会在检测到公式内容时,按需加载 KaTeX,避免首页在没有公式时额外加载相关资源。


Mermaid 图表
Mermaid 代码块也可以保留在文章内容中。编辑器里看到的是 Mermaid 源码,前台则渲染成图表;如果某个环境无法正常渲染,文章仍然保留源代码,不至于只剩下一张无法修改的图片。


这并不意味着所有平台都能直接识别 Mermaid。发布到知乎等平台时,仍然可能需要把图表转成图片上传。但至少在自己的站点里,Markdown 源码和最终展示可以同时保留,后续修改会轻松很多。
保留 Markdown 原文
主题提供了「原文 Markdown」存档入口。发布文章时,可以把本地原文一并保存;文章页面提供复制 Markdown 的按钮,REST 接口也可以返回 Markdown 原文。
如果没有保存原文,主题也会尝试从文章 HTML 反推出 Markdown。不过,反向转换不可能百分之百恢复所有手工排版,因此如果文章需要在多个平台重复发布,建议同时保存原始 Markdown。
我还顺手处理了哪些细节
做主题的过程中,一些原本以为很小的问题也逐渐积累成了功能:
- 代码块语法高亮与一键复制;
- 文章目录和章节定位;
- 表格根据内容自动调整列宽,移动端可展开宽表;
- 文章引用、脚注和交叉链接;
- 引用块、文章卡片和评论区的报纸化样式;
- 图片加载失败时的占位插画;
- 公式、Mermaid 和代码高亮按需加载;
- 移动端重新安排长文与栏目顺序;
- 评论头像使用本地 SVG,不请求 Gravatar;
- 对减少动效和高对比度显示做了基础适配。





这些功能并不是为了把主题做得「什么都有」,而是因为它们确实出现在我的日常文章里。对我来说,一个主题最重要的标准不是功能列表有多长,而是写一篇真实的文章时,会不会频繁被格式问题打断。
测试说明
Paddy Newsprint 目前主要按照「本地 Markdown 写作并发布到 WordPress」的流程进行测试。每次发布前后,我会重点检查以下内容。
页面与响应式测试
- 首页、文章页、页面、分类页、搜索页和 404 页面是否能正常打开;
- 桌面端三栏报纸布局是否保持稳定;
- 平板和手机端是否能自动切换为适合长文阅读的单栏结构;
- 导航、检索弹层、目录和评论区是否可以正常操作;
- 打印样式和减少动效设置是否生效。
内容渲染测试
- 标题层级、目录和章节锚点;
- 行内公式与独立 LaTeX 公式;
- Mermaid 源码与前台图表;
- 代码块、语言标记和复制按钮;
- 表格、宽表和移动端展开行为;
- 图片、失效图片占位和图片说明;
- 引用、脚注、交叉引用和链接;
- 中文 Markdown 原文复制与 REST 输出。
主题工程测试
项目中也保留了若干自动检查脚本,用于进行 PHP 语法、JavaScript 语法、首页标记、区块模板和页面结构的快速验证。例如:
# 主题冒烟测试
bash paddysun-tool/wp-theme-smoke.sh \
./wp-src/wp-content/themes/paddysun-newsprint \
paddysun.localhost \
np-site-header np-lead np-brief np-cards
# 九类页面快速检查
bash paddysun-tool/wp-pages-check.sh
# 区块模板有效性检查
php ../paddysun-tool/validate-block-templates.php
另外,Markdown 接口可以通过下面的地址检查:
https://www.paddysun.top/wp-json/paddysun/v1/posts/<文章 ID>/markdown
需要说明的是,当前版本仍然处于持续实机测试阶段。不同 WordPress 版本、编辑器配置、缓存插件和主机环境,可能会带来不一样的表现。因此,这些测试更多是为了保证主题自身的主要路径稳定,而不是宣称它已经覆盖所有第三方环境。
主题地址与下载安装
主题说明页:https://www.paddysun.top/paddy-newsprint
GitHub 仓库:https://github.com/PaddySun/paddy-newsprint
下载安装包(相关资源正在实机测试):https://cos.paddysun.top/paddy-newsprint/rel/paddy-newsprint-0.10.11.zip
GitHub Release:https://github.com/PaddySun/paddy-newsprint/releases/tag/v0.10.11
欢迎反馈和一起开发
本站已经换装 Paddy Newsprint。如果你在使用过程中遇到任何问题,欢迎在任意评论区留言,也可以通过 paddysun@foxmail.com 联系我,或者直接在 GitHub 上提交 Issue。
如果你对 WordPress 区块主题、Markdown 发布流程、LaTeX、Mermaid 或报纸风格的网页排版感兴趣,也欢迎参与一起开发。这个主题本来就是从个人使用需求出发的,后续仍然会根据真实写作和真实反馈继续调整。
希望它能让更多人少花一点时间处理格式,多花一点时间写文章。

发表回复