Claude Code Skills that format markdown files into beautifully styled HTML 에 최적화 WeChat 공공 계정 기사.

특징

• Markdown을 bm.md 렌더링 서비스를 사용하여 HTML을 스타일링
• ** 자동 로컬 이미지 업로드 ** - Markdown의 로컬 이미지, 업로드, 온라인 URL과 경로 교체
• 사용자 정의 CSS 스타일링 WeChat 문서 읽기 기능 최적화
• 깨끗한 전기를 가진 녹색 악센트 색깔 주제
• GFM (GitHub flavored Markdown) 구문 지원
• 녹색 단순 테마로 강조하는 코드 구문
• 자동 발주 링크 변환
• WeChat 기사 출판사와의 선택적 통합

설치

Claude Code 설치에 이 기술을 추가하십시오:

또는 HTTPS를 통해:

사용법

Claude Code의 기술을 Invoke:

다음을 제공합니다:

• Markdown 파일 경로 : /path/to/my-article.md
• 또는 풀 markdown 내용 직접

예제

기술 의지:

1. 당신의 markdown 파일을 읽으십시오
2. 주문 WeChat 최적화 스타일링 적용
3. ** 지역 이미지를 업로드하고 ** (온라인 URL을 가진 경로를 입력)
4. bm.md API를 호출하여 HTML을 렌더링합니다.
5. 같은 디렉토리에 포맷 된 HTML을 저장
6. WeChat 계정으로 게시하는 혜택

WeChat Article Formatter Skill

A Claude Code skill that formats markdown files into beautifully styled HTML optimized for WeChat public account articles.

Features

• Converts Markdown to styled HTML using bm.md rendering service
• Automatic local image upload - Detects local images in markdown, uploads them, and replaces paths with online URLs
• Custom CSS styling optimized for WeChat article readability
• Green accent color theme with clean typography
• Support for GFM (GitHub Flavored Markdown) syntax
• Code syntax highlighting with green-simple theme
• Automatic footnote link conversion
• Optional integration with WeChat article publisher

Installation

Add this skill to your Claude Code installation:

claude skill add [email protected]:iamzifei/wechat-article-formatter-skill.git

Or via HTTPS:

claude skill add https://github.com/iamzifei/wechat-article-formatter-skill.git

Usage

Invoke the skill in Claude Code:

/wechat-article-formatter

Then provide either:

• A path to your markdown file: /path/to/my-article.md
• Or paste markdown content directly

Example

/wechat-article-formatter

Please format my article at ~/articles/tech-post.md

The skill will:

1. Read your markdown file
2. Apply custom WeChat-optimized styling
3. Detect and upload local images (replacing paths with online URLs)
4. Call the bm.md API to render the HTML
5. Save the formatted HTML to the same directory
6. Offer to publish as a draft to your WeChat account

Image Handling

The skill automatically handles local images in your markdown:

![My Photo](./images/photo.png)           # Relative path - will be uploaded
![Screenshot](/Users/james/demo.png)      # Absolute path - will be uploaded
![Logo](https://example.com/logo.png)     # Online URL - skipped (already online)

Supported image formats: PNG, JPG, JPEG, GIF, WebP, SVG

Images are uploaded using the /image-upload skill and replaced with shareable URLs (e.g., Catbox, ImgBB).

Output

The formatted HTML includes:

• Inline CSS styles (no external dependencies)
• WeChat-compatible markup
• Properly styled headings, paragraphs, lists, and code blocks
• Responsive design for mobile reading

Customization

Modifying Styles

Edit styles/custom.css to customize the appearance:

• Primary color: rgb(53, 179, 120) (green accent)
• Font family: Optima, Microsoft YaHei, PingFangSC-regular
• Base font size: 16px (body), 15px (paragraphs)

API Configuration

The skill uses the following bm.md API settings: