公众号排版终极指南：6套主题+AI一键生成，告别格式烦恼
公众号排版终极指南：6套主题+AI一键生成，告别格式烦恼
【免费下载链接】gzh-design-skill把 Markdown 一键排成可直接粘进公众号编辑器的精致 HTML —— 6 套精选主题 + 主题生成器 + 双关卡校验。An AI-agent skill that turns Markdown into paste-ready WeChat article HTML.项目地址: https://gitcode.com/gh_mirrors/gz/gzh-design-skill
在公众号内容创作中，排版往往是耗时最久、最令人头疼的环节。手动调整样式、担心粘贴后格式丢失、反复预览调试...这些问题让许多内容创作者苦不堪言。现在，gzh-design-skill这款强大的AI排版工具，将彻底改变你的公众号排版体验。
🌟 为什么你需要专业的公众号排版工具
公众号编辑器对HTML格式有着严格的限制，许多常见的CSS样式和HTML标签都会被过滤。这就是为什么你精心设计的排版，粘贴到公众号后经常面目全非。gzh-design-skill正是为了解决这一痛点而生，它专门针对公众号平台的限制进行了深度优化。
核心优势一览
- 全内联样式：所有样式内联处理，文字使用
<span leaf="">包裹，确保粘贴后样式100%保留 - 6套精选主题：摸鱼绿、红白色系、石墨极简、留白禅意、摸鱼票据、橄榄手记，覆盖各类内容题材
- 智能自动化：自动章节编号、关键词下划线标记、引言卡与目录提取
- 双关卡校验：从组件源头的
component_lint.py到最终产物的validate_gzh_html.py，双重保障输出质量 - 主题生成器：不满足现有主题？一句话描述或一张参考图，AI为你生成全新主题
📥 一键安装，快速上手
推荐安装方式
最简单的安装方法只需一行命令：
npx skills add https://gitcode.com/gh_mirrors/gz/gzh-design-skill如果你是手动安装爱好者，也可以通过git克隆到本地：
git clone https://gitcode.com/gh_mirrors/gz/gzh-design-skill.git ~/.claude/skills/gzh-design安装完成后，你就可以在支持Skill的AI Agent（如Claude Code、Codex、Cursor等）中使用了。
使用方式超简单
只需要对AI说一句话：
用摸鱼绿把这篇文章排成公众号HTML：article.mdAI会自动完成整个排版流程，生成可直接粘贴到公众号编辑器的HTML文件。
🎨 6套主题，总有一款适合你
每套主题都经过精心设计，针对不同的内容类型进行了优化：
1. 摸鱼绿（默认主题）
- 主色：
#059669翠绿色 - 适用场景：教程指南、产品测评、工具盘点、清单整理
- 特点：信息密度高，卡片组件丰富，适合干货类内容
2. 红白色系
- 主色：
#DC2626正红色 - 适用场景：深度分析、观点评论、力量感话题
- 特点：经典编辑风，红色元素克制点睛，专业感强
3. 石墨极简风
- 主色：
#52525B石墨灰 - 适用场景：设计评论、科技分析、专业观点、高端品牌
- 特点：极简克制，全灰阶配色，理性专业
4. 留白禅意风
- 主色：
#4A5D52墨绿色 - 适用场景：禅意随笔、极简生活、深度思考、艺术类内容
- 特点：呼吸感最强，大留白设计，宁静雅致
5. 摸鱼票据风
- 主色：
#059669翠绿色 - 适用场景：工具对比、创意评测、票据式视觉隐喻
- 特点：票据/门票设计风格，硬阴影卡片，星级评分
6. 橄榄手记
- 主色：
#1e1f23墨黑色配橙色#ed7b2f - 适用场景：内刊手记、深度评测、案例复盘、系统说明
- 特点：编辑部内刊质感，分节形式多样，信息密度高
🔄 完整工作流程解析
第一步：输入格式归一化
gzh-design-skill支持多种输入格式：
- Markdown文件：直接进入排版流程
- Word文档：通过
scripts/extract_docx.py自动转换 - PDF文件：智能读取并清理格式
- 纯文本：自动推断结构并格式化
无论你的原始文件是什么格式，系统都会先将其转换为标准的Markdown格式，确保后续排版顺利进行。
第二步：智能主题推荐
系统会根据文章内容自动推荐最合适的主题：
- 教程/测评类→ 摸鱼绿
- 深度分析类→ 红白色系
- 设计/科技类→ 石墨极简风
- 禅意/随笔类→ 留白禅意风
- 工具对比类→ 摸鱼票据风
- 内刊/案例类→ 橄榄手记
第三步：智能组件装配
系统会自动识别并处理各种元素：
- 章节标题：自动编号，末章显示为∞或///
- 关键词标记：每段自动标记1-3个关键词并添加下划线
- 引言卡提取：从正文开头提取引用块作为引言卡
- 目录生成：自动生成文章导航目录
- 代码块处理：支持深色/浅色主题，等宽字体不折行
- 图片/GIF处理：自适应尺寸，GIF自动添加动图标识
第四步：质量合规校验
生成HTML后，必须运行校验脚本确保符合公众号平台要求：
python3 scripts/validate_gzh_html.py out.html这个脚本会检查：
- 禁用标签（div/class/style等）
- 文字是否用
<span leaf>包裹 - 标点是否全角
- 样式是否全部内联
第五步：一键复制粘贴
最终会生成两个文件：
- 干净正文文件：
{原文件名}_排版_{主题中文名}({英文标识}).html - 带复制按钮的预览页：
{...}_预览.html
只需打开预览页，点击右上角的"复制到公众号"按钮，然后粘贴到公众号编辑器即可。
🛠️ 高级功能：自定义主题生成
如果你对现有主题不满意，可以使用强大的主题生成器：
生成全新主题的步骤
- 提供描述或参考图：告诉AI你想要什么样的风格
- AI生成组件库：AI会生成45-75个区块的完整HTML组件库
- 预览确认：预览保存在
assets/theme-previews/{id}.html - 转换为标准主题库：确认后转换为标准格式并登记到
references/theme-index.md
主题生成器的优势
- 完全个性化：根据你的品牌调性定制
- 快速迭代：不满意可以随时调整重新生成
- 永久保存：生成的主题会保存到本地，永久可用
📂 项目结构深度解析
了解项目结构有助于更好地使用这个工具：
gzh-design-skill/ ├── SKILL.md # 主工作流文档（AI入口） ├── references/ # 核心组件库 │ ├── theme-index.md # 6套主题索引 │ ├── theme-*.md # 各主题组件库（6个文件） │ ├── theme-generator.md # 主题生成器指南 │ ├── common-components.md # 跨主题通用组件 │ └── eval-cases.md # 测试用例 ├── scripts/ # 校验脚本 │ ├── validate_gzh_html.py # 最终产物合规校验 │ └── component_lint.py # 组件库源头检查 ├── docs/ # 文档与预览 │ ├── gallery/ # 主题浏览器预览 │ └── all-themes.md # 全主题效果展示 └── archive/ # 历史版本存档💡 实用技巧与最佳实践
1. 选择合适的输入格式
- 优先使用Markdown：最直接，无需转换
- Word文档：保留原有格式和图片
- PDF文件：适合扫描版文档
- 纯文本：适合简单内容
2. 优化文章结构
- 使用
#表示一级标题 - 使用
##表示二级标题 - 使用
###表示三级标题 - 使用
>表示引用块 - 使用
**文字**表示加粗 - 使用
==文字==表示高亮 - 使用
<u>文字</u>表示下划线
3. 充分利用智能功能
- 自动章节编号：无需手动编号
- 关键词标记：让重点内容更突出
- 引言卡提取：开头引用自动美化
- 目录生成：长文必备导航功能
4. 质量检查要点
- 运行校验脚本确保合规
- 在预览页测试复制粘贴
- 检查图片自适应效果
- 确认全角标点转换
❓ 常见问题解答
Q：粘贴到公众号后样式会丢失吗？
A：不会。所有样式都是内联的，文字使用<span leaf="">包裹，这是公众号编辑器兼容的最佳实践。
Q：只能在Claude Code中使用吗？
A：不是的。任何能够读取Skill目录的AI Agent都可以使用，包括Codex、Cursor等。
Q：如何更新到最新版本？
A：重新运行安装命令即可更新，或者到安装目录执行git pull。
Q：可以一次生成多套主题对比吗？
A：可以。告诉AI"用这几套主题各排一遍这篇"，就会批量生成多套供你挑选。
Q：支持哪些AI Agent？
A：支持所有能够读取Skill目录的AI Agent，包括但不限于：
- Claude Code
- Codex
- Cursor
- 其他兼容的AI助手
🚀 开始你的高效排版之旅
gzh-design-skill不仅仅是一个排版工具，更是内容创作者的效率利器。通过智能化的主题推荐、自动化的组件装配、严格的质量校验，它让公众号排版从繁琐的手工劳动变成了简单的指令操作。
无论你是公众号新手还是资深创作者，无论你写的是技术教程、深度分析还是生活随笔，gzh-design-skill都能为你提供专业、美观、合规的排版解决方案。
现在就开始使用吧，让你的公众号内容在视觉上也能脱颖而出！
小贴士：初次使用时，建议先用
assets/sample-article.md这个示例文件进行测试，熟悉整个工作流程后再处理自己的文章。
【免费下载链接】gzh-design-skill把 Markdown 一键排成可直接粘进公众号编辑器的精致 HTML —— 6 套精选主题 + 主题生成器 + 双关卡校验。An AI-agent skill that turns Markdown into paste-ready WeChat article HTML.项目地址: https://gitcode.com/gh_mirrors/gz/gzh-design-skill
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考