md-to-wechat

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Markdown to WeChat HTML

Markdown to WeChat HTML

将Markdown格式的文章转换为微信公众号编辑器兼容的HTML格式。
Convert Markdown-formatted articles to HTML format compatible with WeChat Official Account Editor.

When to Use

When to Use

Use This Skill When

Use This Skill When

  • 需要将Markdown文章发布到微信公众号
  • 需要自定义公众号文章的主题色
  • 生成带样式的公众号HTML内容
  • 批量将Markdown文档转为公众号格式
  • 需要场景卡片、结论框等特殊组件
  • 确保公众号文章在各平台显示一致
  • Need to publish Markdown articles to WeChat Official Account
  • Need to customize the theme color of WeChat Official Account articles
  • Generate styled WeChat Official Account HTML content
  • Batch convert Markdown documents to WeChat Official Account format
  • Need special components like scenario cards, conclusion boxes, etc.
  • Ensure consistent display of WeChat Official Account articles across platforms

Do NOT Use This Skill If

Do NOT Use This Skill If

  • 需要复杂的交互式排版
  • 图片需要直接嵌入(微信不支持外部图片URL)
  • 需要动态内容或脚本
  • 文章超过2万字(微信建议限制)
  • Need complex interactive layout
  • Images need to be embedded directly (WeChat does not support external image URLs)
  • Need dynamic content or scripts
  • Article exceeds 20,000 words (WeChat's recommended limit)

Typical Trigger Phrases

Typical Trigger Phrases

Chinese:
  • "Markdown转公众号"
  • "生成公众号HTML"
  • "公众号排版工具"
  • "发微信公众号"
  • "微信文章转换"
  • "公众号样式"
English:
  • "Markdown to WeChat"
  • "Generate WeChat HTML"
  • "WeChat article formatter"
  • "Convert to WeChat format"
  • "WeChat publishing tool"
  • "WeChat style conversion"
Chinese:
  • "Markdown to WeChat Official Account"
  • "Generate WeChat Official Account HTML"
  • "WeChat Official Account formatting tool"
  • "Publish to WeChat Official Account"
  • "WeChat article conversion"
  • "WeChat Official Account styles"
English:
  • "Markdown to WeChat"
  • "Generate WeChat HTML"
  • "WeChat article formatter"
  • "Convert to WeChat format"
  • "WeChat publishing tool"
  • "WeChat style conversion"

Workflow

Workflow

Step 1: 准备Markdown内容

Step 1: Prepare Markdown Content

编写标准Markdown格式文章:
markdown
undefined
Write articles in standard Markdown format:
markdown
undefined

文章主标题

Article Main Title

章节标题

Section Title

小节标题

Subsection Title

引用内容
  • 列表项 | 表格 | 数据 |
undefined
Quoted Content
  • List Item | Table | Data |
undefined

Step 2: 配置元数据

Step 2: Configure Metadata

python
converter = MarkdownToWechatConverter(
    title="文章标题",
    subtitle="副标题",
    author="作者名称",
    tags=["标签1", "标签2"]
)
python
converter = MarkdownToWechatConverter(
    title="Article Title",
    subtitle="Subtitle",
    author="Author Name",
    tags=["Tag1", "Tag2"]
)

Step 3: 执行转换

Step 3: Execute Conversion

bash
./skills/md-to-wechat/scripts/md-to-wechat.sh input.md -o output.html
bash
./skills/md-to-wechat/scripts/md-to-wechat.sh input.md -o output.html

Step 4: 验证与发布

Step 4: Verify and Publish

  • 复制HTML到公众号编辑器
  • 上传图片到微信素材库
  • iOS/Android真机预览
  • Copy HTML to WeChat Official Account Editor
  • Upload images to WeChat Material Library
  • Preview on iOS/Android real devices

Guardrails

Guardrails

Anti-Patterns

Anti-Patterns

  • ❌ 使用外部图片URL(微信不支持)
  • ❌ 文章超过2万字
  • ❌ 不测试移动端显示效果
  • ❌ 忽略微信的样式限制
  • ❌ Use external image URLs (WeChat does not support this)
  • ❌ Article exceeds 20,000 words
  • ❌ Do not test mobile display effects
  • ❌ Ignore WeChat's style restrictions

Limitations

Limitations

  • 不支持CSS变量和伪元素
  • 外部图片URL需上传素材库
  • 复杂表格可能显示异常
  • 部分特殊字符需转义
  • Does not support CSS variables and pseudo-elements
  • External image URLs must be uploaded to the material library
  • Complex tables may display abnormally
  • Some special characters need to be escaped

Important Notes

Important Notes

  1. 图片处理: 微信编辑器不支持外部图片URL,需上传到微信素材库
  2. 预览测试: 务必在iOS和Android真机预览
  3. 字数限制: 单篇文章建议不超过2万字
  4. 样式兼容性: 使用全内联样式确保兼容
  1. Image Handling: WeChat Editor does not support external image URLs; upload them to WeChat Material Library
  2. Preview Testing: Always preview on iOS and Android real devices
  3. Word Count Limit: Single articles are recommended to not exceed 20,000 words
  4. Style Compatibility: Use full inline styles to ensure compatibility

Supported Markdown Syntax

Supported Markdown Syntax

Markdown公众号样式
# 标题
文章主标题(封面区域)
## 标题
章节标题(带金色装饰线)
### 标题
小节标题(带左边框)
> 引用
引用块(带大引号装饰)
**加粗**
黑色加粗文字
`代码`
行内代码(珊瑚色)
\
``代码块````
深色背景代码块
| 表格 |
精美表格(深色表头)
- 列表
无序列表
【场景重现】
场景卡片(珊瑚色边框)
【结论】
结论黑框(深色背景)
MarkdownWeChat Official Account Style
# Heading
Article main title (cover area)
## Heading
Section title (with golden decorative line)
### Heading
Subsection title (with left border)
> Quote
Quote block (with large quote decoration)
**Bold**
Black bold text
`Code`
Inline code (coral color)
\
``Code Block````
Dark background code block
| Table |
Exquisite table (dark header)
- List
Unordered list
【Scenario Recap】
Scenario card (coral border)
【Conclusion】
Conclusion box (dark background)

Usage

Usage

Command Line

Command Line

bash
undefined
bash
undefined

基本用法

Basic Usage

./skills/md-to-wechat/scripts/md-to-wechat.sh input.md
./skills/md-to-wechat/scripts/md-to-wechat.sh input.md

指定输出文件

Specify Output File

./skills/md-to-wechat/scripts/md-to-wechat.sh input.md -o output.html
./skills/md-to-wechat/scripts/md-to-wechat.sh input.md -o output.html

完整参数

Full Parameters

./skills/md-to-wechat/scripts/md-to-wechat.sh input.md
-o output.html
-t "文章标题"
-s "副标题描述"
-a "作者名称"
--tags "标签1,标签2,标签3"
undefined
./skills/md-to-wechat/scripts/md-to-wechat.sh input.md
-o output.html
-t "Article Title"
-s "Subtitle Description"
-a "Author Name"
--tags "Tag1,Tag2,Tag3"
undefined

Python API

Python API

python
from skills.md_to_wechat.md_to_wechat import MarkdownToWechatConverter
python
from skills.md_to_wechat.md_to_wechat import MarkdownToWechatConverter

创建转换器

Create Converter

converter = MarkdownToWechatConverter( title="文章标题", subtitle="副标题", author="作者", tags=["标签1", "标签2"] )
converter = MarkdownToWechatConverter( title="Article Title", subtitle="Subtitle", author="Author", tags=["Tag1", "Tag2"] )

转换Markdown

Convert Markdown

with open('input.md', 'r', encoding='utf-8') as f: markdown_text = f.read()
html = converter.convert(markdown_text)
with open('input.md', 'r', encoding='utf-8') as f: markdown_text = f.read()
html = converter.convert(markdown_text)

保存

Save

with open('output.html', 'w', encoding='utf-8') as f: f.write(html)
undefined
with open('output.html', 'w', encoding='utf-8') as f: f.write(html)
undefined

Style Components

Style Components

Chapter Heading (##)

Chapter Heading (##)

带金色装饰线的章节标题:
html
<div style="display:flex;align-items:center;gap:12px;">
  <div style="width:6px;height:28px;background:#d4a574;border-radius:3px;"></div>
  <h2>章节标题</h2>
</div>
Section title with golden decorative line:
html
<div style="display:flex;align-items:center;gap:12px;">
  <div style="width:6px;height:28px;background:#d4a574;border-radius:3px;"></div>
  <h2>Section Title</h2>
</div>

Quote Block (>)

Quote Block (>)

带大引号装饰的引用块,支持作者署名:
markdown
> 引用内容
> —— 作者名称
Quote block with large quote decoration, supporting author attribution:
markdown
> Quoted Content
> —— Author Name

Scene Card(【场景重现】)

Scene Card (【Scenario Recap】)

特殊标记生成珊瑚色边框的场景卡片:
markdown
【场景重现】
这里是场景描述内容...
Special tag generates scenario card with coral border:
markdown
【Scenario Recap】
Here is the scenario description content...

Conclusion Box(【结论】)

Conclusion Box (【Conclusion】)

深色背景的结论框:
markdown
【结论】
这里是结论内容...
Conclusion box with dark background:
markdown
【Conclusion】
Here is the conclusion content...

Table

Table

标准Markdown表格转换为精美样式表格:
markdown
| 项目 | 费用 | 频率 |
|------|------|------|
| Token | $0.003 | 持续 |
| 服务器 | $20 | 月付 |
Standard Markdown table converted to beautifully styled table:
markdown
| Item | Cost | Frequency |
|------|------|------|
| Token | $0.003 | Recurring |
| Server | $20 | Monthly |

Code Block

Code Block

深色背景的代码块,支持语法高亮:
markdown
```json
{
  "key": "value"
}
undefined
Dark background code block with syntax highlighting support:
markdown
```json
{
  "key": "value"
}
undefined

Theme Colors

Theme Colors

默认使用金色+珊瑚色主题,可自定义:
python
colors = {
    'primary': '#d4a574',      # 金色 - 主色调
    'accent': '#e07a5f',       # 珊瑚色 - 强调色
    'dark': '#2d3436',         # 深色 - 表格头部
    'text': '#1a1a1a',         # 主文字
    'text_secondary': '#666',  # 次要文字
    'bg_light': '#f5f5f5',     # 浅灰背景
    'bg_card': '#f8f9fa',      # 卡片背景
}

converter = MarkdownToWechatConverter(colors=colors)
Default theme uses gold + coral colors, customizable:
python
colors = {
    'primary': '#d4a574',      # Gold - Primary Color
    'accent': '#e07a5f',       # Coral - Accent Color
    'dark': '#2d3436',         # Dark - Table Header
    'text': '#1a1a1a',         # Main Text
    'text_secondary': '#666',  # Secondary Text
    'bg_light': '#f5f5f5',     # Light Gray Background
    'bg_card': '#f8f9fa',      # Card Background
}

converter = MarkdownToWechatConverter(colors=colors)

Compatibility

Compatibility

  • ✅ 微信公众号编辑器
  • ✅ 企业微信
  • ✅ 微信内置浏览器
  • ✅ 支持iOS/Android/Windows
  • ✅ WeChat Official Account Editor
  • ✅ WeChat Work
  • ✅ WeChat Built-in Browser
  • ✅ Supports iOS/Android/Windows

Related Skills

Related Skills

SkillRelationshipUse Case
content-extractor内容来源提取内容后发公众号
long-form-writer内容生成生成Markdown长文
document-hub格式补充生成Word/PDF版本
wechat-article-fetcher反向操作抓取公众号文章
image-ocr辅助识别识别图片文字入文章
SkillRelationshipUse Case
content-extractorContent SourceExtract content before publishing to WeChat Official Account
long-form-writerContent GenerationGenerate long-form Markdown articles
document-hubFormat SupplementGenerate Word/PDF versions
wechat-article-fetcherReverse OperationCrawl WeChat Official Account articles
image-ocrAuxiliary RecognitionRecognize text from images into articles

Workflow Integration

Workflow Integration

Workflow: 长文 → 公众号

Workflow: Long-form Article → WeChat Official Account

python
from skills.long_form_writer import expand_outline
from skills.md_to_wechat.md_to_wechat import MarkdownToWechatConverter
python
from skills.long_form_writer import expand_outline
from skills.md_to_wechat.md_to_wechat import MarkdownToWechatConverter

生成长文

Generate Long-form Article

markdown_text = expand_outline(outline_path="outline.md")
markdown_text = expand_outline(outline_path="outline.md")

转换为公众号HTML

Convert to WeChat Official Account HTML

converter = MarkdownToWechatConverter( title="文章标题", subtitle="副标题", author="作者" ) html = converter.convert(markdown_text)
converter = MarkdownToWechatConverter( title="Article Title", subtitle="Subtitle", author="Author" ) html = converter.convert(markdown_text)

保存

Save

with open("wechat.html", "w", encoding="utf-8") as f: f.write(html)
undefined
with open("wechat.html", "w", encoding="utf-8") as f: f.write(html)
undefined

Changelog

Changelog

  • v1.0.0 (2026-02-14)
    • 初始版本
    • 支持基础Markdown语法转换
    • 支持场景卡片、结论框等特殊组件
    • 支持自定义主题色
  • v1.0.0 (2026-02-14)
    • Initial version
    • Supports basic Markdown syntax conversion
    • Supports special components like scenario cards, conclusion boxes, etc.
    • Supports custom theme colors

About UniqueClub

About UniqueClub

Part of the UniqueClub toolkit - a collection of skills for AI-powered content creation and automation.
Part of the UniqueClub toolkit - a collection of skills for AI-powered content creation and automation.