微信公众号文章 HTML 转换器#

将 Markdown 源文件转换为微信公众号编辑器兼容的纯 HTML 格式。

转换规则（强制）#

所有 Markdown 语法必须转为带内联样式的 HTML 标签。禁止输出任何残留 Markdown 语法。

标题映射#

MarkdownHTML# 标题``<h1 style="margin:1.5em 0 0.5em;font-weight:700;">标题</h1>``## 标题``<h2 style="margin:1.5em 0 0.5em;font-weight:700;">标题</h2>``### 标题``<h3 style="margin:1.5em 0 0.5em;font-weight:700;">标题</h3>``#### 标题``<h4 style="margin:1.5em 0 0.5em;font-weight:700;">标题</h4>

正文段落#

text

<p style="margin:10px 0;font-size:14px;line-height:1.8;">内容</p>

列表#

html

<ul style="margin:10px 0;padding-left:24px;">
  <li style="margin:4px 0;">内容</li>
</ul>

有序列表用 <ol style="margin:10px 0;padding-left:24px;">。

粗体#

**文字** → <strong>文字</strong>

行内代码#

`代码` → <code style="background:#f6f8fa;color:#005cc5;padding:1px 4px;border-radius:3px;font-size:0.9em;">代码</code>

表格#

html

<table style="border-collapse:collapse;width:100%;font-size:14px;line-height:1.6;margin:10px 0;">
  <thead>
    <tr>
      <th style="background:#f6f8fa;border:1px solid #d0d7de;padding:6px 12px;text-align:left;font-weight:600;">表头</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td style="border:1px solid #d0d7de;padding:6px 12px;">内容</td>
    </tr>
  </tbody>
</table>

引用块#

html

<blockquote style="background:#f6f8fa;border-left:4px solid #0969da;margin:16px 0;padding:12px 20px;color:#1f2328;">
  <p style="margin:0;font-size:14px;line-height:1.8;">引用内容</p>
</blockquote>

代码块#

代码块使用 <section> + 每行一个 <p> 的结构（微信编辑器会吞掉 <pre>/ <code> 的空白和换行）：

html

<section style="background:#282c34;color:#abb2bf;border-radius:6px;padding:12px 16px;margin:10px 0;overflow-x:auto;">
  <p style="margin:0;padding:0;font-size:14px;line-height:1.6;">第一行代码</p>
  <p style="margin:0;padding:0;font-size:14px;line-height:1.6;">第二行代码</p>
</section>

代码块语法高亮配色（GitHub Dark × #282c34）

元素CSS color 值基础文本#ffffff关键字#ff7b72函数名#d2a8ff字符串#a5d6ff数字#79c0ff注释#8b949e内置命令#7ee787类名#f0883e

行首缩进用   替换空格。注释行单独加 color:#8b949e。

配图#

html

<figure style="text-align:center;margin:20px 0;">
  <img src="CDN_URL" style="max-width:100%;border-radius:8px;" alt="图片说明">
  <figcaption style="margin-top:8px;font-size:13px;color:#666;text-align:center;"></figcaption>
</figure>

配图位置：引言 blockquote 后面。

链接#

[文字](url) → 纯文本「文字」（去掉链接语法，保留文字）

删除项#

• YAML front matter（ --- 开头的元数据块）
• --- 分隔线
• 本地图片路径（替换为 CDN URL）

工作流程#

1. 读取源 Markdown 文件
2. 按上述规则逐行转换为 HTML
3. <section> 代码块原样保留（已是正确 HTML）
4. 配图用 <figure> 包裹，CDN URL 替换本地路径
5. 输出 *_for_paste.html 文件，供用户复制粘贴到微信草稿箱

关键字上色（可选）#

用户可指定关键字上色方案。默认配色：

颜色色值用途🔴 红#d73a49核心概念🟣 紫#6f42c1工具/命令🔵 蓝#005cc5参数/文件名🟠 橙#e36209关键数值/信号

注意事项#

• 禁止使用 <pre> / <code> 包裹代码块（微信会吞掉空白）
• 每行代码必须是独立的 <p> 元素
• 中文内容原样保留，不做任何修改或扩展
• 输出文件编码必须为 UTF-8（ ensure_ascii=False）