
isjiamu/gzh-design-skill
Developer toolsThis page was translated automatically. Technical details may differ from the original. View the original
Arrange Markdown into refined HTML with one click that can be directly pasted into the official account editor—6 sets of featured themes + theme generator + dual-level verification. An AI-agent skill that turns Markdown into paste-ready WeChat article HTML.
Overview
🤝 — The layout components, theme design, and quality standards embody the practice and joint refinement of their public accounts. Special thanks to Xiao Li. 6 Featured Themes + Theme Generator · Code Blocks/Images/GIFs · Automatic Chapter Numbering and Keyword Tagging · Dual-Level Quality Check A Typesetting Skill for Official Accounts for AI Agents (Claude Code / Codex / Cursor, etc.). After you finish writing Markdown, it generates ** HTML according to the theme you select—automatically assigning chapter numbers, underlining keywords, adding quotation cards and table of contents, handling code blocks and images, merging author signatures, and using scripts to definitively cover all the limitations of the Official Account platform. - : Fishing Green (default) · Red and White · Graphite minimalism · Zen Blank Notes · Sneaky notes · Olive Notes — Each set is a self-contained thick component library (design variables + dozens of detailed components + visual hierarchy table + article type recipe table). - : Not satisfied with the existing topic? Use a one-sentence description or a reference image to generate a brand-new component library and save it for local reuse (see references/theme-generator.md). - : Code blocks (dark/light color, with equal width without folding lines), images, GIFs (with animated image corner labels), inline code, citations, lists, product badges. - : Chapters are automatically numbered (last chapter ∞ / ///), each paragraph actively underlined with 1–3 keywords, and the introduction card is extracted from the main text and merged with the table of contents and author signatures for deduplication. - : The main text is automatically standardized in full-width, with code blocks preserved as is. - : All styles are inlined, text wrapped, and avoid the filtering of //class/grid/position and other official account formats. - :component_lint.py (source of the component library) + validate_gzh_html.py (final product) forms a reproducible closed loop of "revision → → revision." - : Generates a preview page with a "Copy" button; click to copy rich text to the clipboard and paste it directly into the official account, eliminating manual selection. 6 sets of themed articles in the same row (real long images, including illustrations, quotation cards, numbered chapters, memorable quotes, noun annotations, and other complete components): 📚 | After cloning, the browser opens docs/gallery/index.html to view the full interactive HTML. :Viewpoints/In-depth Analysis · Tutorials/Operation Guides · Reviews/Tool Inventory · Knowledge Organization/Methodology · Interviews/Feature Stories · Data Review/Reports · Life/Emotional Reflections · Case Studies — Arrange Markdown / Word / PDF / Plain Text Long Articles into HTML with one click that can be directly pasted into the Official Account editor; You can also generate custom themes based on descriptions or reference images.
Overview (machine translated)
🏠 > Main repository hosted in github.com/isjiamu/gzh-design-skill | Image synchronization: AtomGit:atomgit.com/zuiyn/gzh-design-skill
🤝 > **This project is co-built by Jiamu × ‘Xiao Li Mo Yu’ — the layout components, theme design, and quality standards embody the practice and joint refinement of their public accounts. Special thanks to Xiao Li.
gzh-design-skill · Official account layout skills
Arrange Markdown into Exquisite HTML with One Click That Can Be Directly Pasted into the WeChat Official Account Editor
6 Featured Themes + Theme Generator · Code Blocks/Images/GIFs · Automatic Chapter Numbering and Keyword Tagging · Dual-Level Quality Check
English | Chinese
A typesetting skill for AI Agents (Claude Code / Codex / Cursor, etc.) for official accounts. After you finish writing Markdown, it generates HTML with full inline styles according to your chosen theme, pastes it into the official account editor without losing formatting—automatically assigning chapter numbers, underlining keywords, adding quotation cards and table of contents, handling code blocks and images, merging author signatures, and using scripts to definitively cover all the platform’s limitations.
✨ Core Features
- 6 Selected Themes: Fishing Green (default) · Red & White · Graphite Minimalism · Zen Blank · Fishing Note · Olive Notes — Each set is a self-contained thick component library (design variables + dozens of detailed components + visual hierarchy table + article type recipe table).
- Theme Generator: Not satisfied with a ready-made theme? Generate a brand-new component library with a one-sentence description or a reference image and save it for local reuse (see
references/theme-generator.md). - Full content compatibility: code blocks (dark/light color, with equal width without folding lines), images, GIFs (with image corner labels), inline code, citations, lists, product badges.
- Intelligent Formatting: Chapters are automatically numbered (last chapter ∞ / ///), each paragraph actively underlines 1–3 keywords, extracts quotation cards from the main text and the table of contents, and deduplicates the author’s signature.
- Chinese Full-Width Punctuation: The main text automatically standardizes full-width text, preserving the code block as is.
- No Format Removed: All styles are inlined, text
wrapped, avoiding/ /class/grid/positionand other official account filtering methods. - Dual-Level Quality Verification:
component_lint.py(Source of the Component Library) +validate_gzh_html.py(Final Product), forming a reproducible ‘→ → Repair’ closed loop. - One-Click Copy: Generate a preview page with a “Copy” button. Click to copy the rich text to the clipboard and paste it directly into the official account for manual selection.
👀 Effect Preview
6 sets of themed articles in the same row (real long images, including illustrations, quotation cards, numbered chapters, memorable quotes, noun annotations, and other complete components):
Fishing Green (default)
Red and white tones
Olive Notes
Graphite minimalist style
This page was translated automatically. Technical details may differ from the original.
Recommended Tools
Try a different keyword or remove a filter.
Install
npx skillfish add isjiamu/gzh-design-skill