skills.rest
shiker1996
shiker1996COMMUNITY
Explore all skills by this author →
WebsiteGitHub

wechat-md-to-draft

Convert WeChat article Markdown with design tokens into a UTF-8 HTML draft.

5|1|Updated Jul 31, 2026
Search Tags:#markdown#html#design tokens#typesetting#article#conversion#wechat
One-click install
npx skills add https://github.com/shiker1996/wechat-editroom --skill wechat-md-to-draft-shiker1996
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: wechat-md-to-draft
Source: https://github.com/shiker1996/wechat-editroom/tree/main/skills/wechat-md-to-draft
Command: npx skills add https://github.com/shiker1996/wechat-editroom --skill wechat-md-to-draft-shiker1996

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Turning a finished WeChat article Markdown file into publishable HTML by hand is error-prone: styles drift from the design scheme, headings get reordered, and image or source references get lost. This Skill performs the structural conversion deterministically while preserving every paragraph, heading, source, and image caption. ## Core Features & Use Cases - Faithful Markdown-to-HTML conversion: Reads <stem>.images.md, <stem>.design-scheme.md, and magazine-design-tokens.json, then writes article.ai.draft.html without rewriting body text, numbers, or sources. - Token-driven styling: Colors, font sizes, and spacing come from the design tokens file, with inline styles and a responsive fluid root container suited to the WeChat editor. - Built-in quality gates: Verifies non-empty UTF-8 output, balanced tags, matching heading counts, preserved links and images, and rejects leftover Mermaid/ECharts fences by returning to the image stage. - Use Case: After the typesetting pipeline finishes image processing, invoke this stage to produce the complete HTML draft of a long-form WeChat article, converting chapter by chapter and stitching sections in original order. ## Quick Start Use the wechat-md-to-draft skill to convert this Markdown article into a WeChat HTML draft using its design scheme and tokens.

Frequently Asked Questions about wechat-md-to-draft

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert Markdown to WeChat official account HTML?▼

Provide the rendered Markdown file alongside its design scheme and design tokens JSON, and the conversion produces an article.ai.draft.html file in the same directory. Body text, headings, sources, and image captions are preserved exactly while structure and styling are applied.

What input files does the Markdown to HTML conversion require?▼

It reads three files: the rendered Markdown with image references (<stem>.images.md), the design scheme (<stem>.design-scheme.md), and magazine-design-tokens.json. All colors, font sizes, and spacing come from the tokens file rather than hardcoded values.

Does the conversion support fixed-width layouts for desktop preview?▼

No. The root container uses a responsive fluid layout with width:auto and max-width:none, because the WeChat editor supplies its own content width. Fixed widths like 720px and margin:auto centering are explicitly disallowed.

What happens if Mermaid or ECharts blocks remain in the Markdown?▼

The gate check detects leftover Mermaid or ECharts fences and returns the work to the upstream image processing stage instead of attempting to render them. Diagrams must be converted to images before this conversion runs.

Can this skill handle very long articles?▼

Yes. Long articles can be converted chapter by chapter and stitched back in original order, keeping a single document shell. Lists, tables, code blocks, quotes, and image captions must not be split across segments.

Does the conversion upload images or publish the article?▼

No. It only produces the HTML draft. Image uploading, HTML normalization, preview, and publishing are handled by other stages in the pipeline and are explicitly out of scope.

Related Skills

Explore More Content & Communication Skills→
labs21-devlabs21-dev
28

brand-identity-extractor

Extract brand design systems and handoff tokens from images, mood boards, or briefs.

Official
Advanced
zhangdahai112zhangdahai112
2

wechat-draft-publisher

Publish HTML articles as WeChat Official Account drafts with cover images.

Community
Advanced
taizen-aitaizen-ai
8

content-reviewer

Review content for quality, clarity, and brand alignment before publishing.

Official
Advanced
acefrost511acefrost511

md2wechat

Convert Markdown articles into WeChat-compatible HTML with inline styles.

Community
Intermediate