乐于分享
好东西不私藏

AI 生成的排版,为什么不能直接发公众号?

AI 生成的排版,为什么不能直接发公众号?

提示词-转换桥-粘贴发布

本文即用该工具生成排版

朋友发来一个文件,说用AI生成的排版看起来挺完整,但复制到公众号后台后样式全乱了。

我打开一看,是个HTML文件。问题就清楚了:这不是公众号正文,而是网页。要想正常发布,还需要把它变成公众号能接受的富文本。

先看问题在哪

浏览器里

HTML、CSS、布局规则都能被完整解析,卡片、背景色、双栏、表格看起来都正常。

公众号后台里

样式可能被过滤或改写,复制进去后出现背景丢失、边框消失、模块错位、手机端溢出。

步骤一
先把网页排版改成公众号适配HTML
核心判断

公众号后台无法稳定读取原始HTML的完整格式,所以第一步不是复制,而是改写。

把样式写进元素里

关键背景、边框、字号、间距尽量改成内联 style,减少被后台吞掉的概率。

把复杂布局改简单

去掉脚本、外链样式、复杂布局,把多栏、表格、横向模块改成更适合手机阅读的结构。

给文字加换行保护

所有文字容器都加上 max-width、word-break、overflow-wrap,避免手机端撑出边框。

可以直接用的提示词将 HTML 文件转换成微信公众号后台可用的格式,并尽量保留原有排版风格,同时需适配手机屏幕浏览,避免内容超出边框,避免依赖横向滚动。

适配前后对比

原始网页排版

· 双栏或多栏

· 表格直接展示

· 依赖 style/class

公众号适配排版

· 多栏改卡片

· 表格改信息卡

· 关键样式内联

过程中的坑
适配HTML还不能直接粘公众号后台

适配HTML解决的是结构问题,但公众号后台直接粘HTML,格式仍然可能丢。真正更稳的方式,是先把它渲染成富文本。

正确流程:AI 生成 HTML → 公众号适配 HTML → 富文本渲染 → 复制到公众号后台。

个人工作演进

阶段 1

借助135编辑器,把适配后的HTML排版内容渲染成公众号后台更容易接受的富文本。

阶段 2

识别出135真正承担的是“HTML到富文本”的中转,而不是必须依赖它的全部模板能力。

阶段 3

直接通过AI制作了一个工具,他自己起名“富文本桥”,来替代这一步,更简单易用:左侧粘适配HTML,右侧渲染,点击复制富文本,再粘贴到公众号后台。

解决方案:AI直接制作转换工具
现在可以将适配过公众号后台可用格式的HTML文件,用富文本桥直接完成转换
关键转折

不是再找一个编辑器,而是把“中转复制”单独做出来

135b当看机器时真正帮我完成的,不是模板设计,而是把适配后的HTML渲染成公众号后台可以承接的富文本。于是这一步被拆成了一个更轻的富文本桥。

富文本桥只做三件事

01 读取

放入已经处理好的公众号适配 HTML,包括内联样式、手机单列和换行保护。

02 渲染

把代码变成可视化排版,先确认样式、间距、模块层次在页面里是正常的。

03 复制

直接复制渲染后的富文本,再粘贴到公众号后台,而不是把原始 HTML 粘进去。

现在的操作链路

适配 HTML富文本桥公众号后台

边界说明富文本桥替代的是135的中转复制能力,不是公众号后台的最终审核。粘贴进后台后,仍然要做一次手机预览。

所以,AI 生成的排版不是不能用。问题在于,它生成的是网页,而公众号后台需要的是稳定的富文本。

现在的完整流程是:AI 生成排版 → 转成公众号适配 HTML → 富文本桥渲染 → 复制富文本 → 公众号后台发布。

如果你是通过openclaw、codex或者其他能制作skill的工具来完成的,可以把“公众号排版要求”和“生成富文本格式”让他记到skill当中。

再简单些,也可以把我的这个工具直接给到你的AI,让他集成到公众号排版工作流中~