TypingMindTypingMindThe best frontend for AI
Wechat Html Cover logo

Wechat Html Cover

Community
843645440
wechat-html-cover

使用受约束 JSON、固定 HTML/CSS 和 Chrome/Chromium 确定性生成微信公众号封面 PNG。用于完整公众号流水线必须提供 thumb_media_id，或需要准确中文标题、独立封面视觉且不调用图片模型的 1410×600 封面时；不生成正文图片。

Overview

Publisher843645440
Repositorywechat-skill
Skill namewechat-html-cover
Stars
132
Forks
29
Bundled files
8
Links
Skill sourceRepository
  • Markdown instructions

    A SKILL.md file the model loads on demand, so it only costs tokens when a request actually matches.

  • Works with any LLM

    AI skills are plain Markdown, not provider-specific code, so this works with GPT, Claude, Gemini, Grok, or a local model.

  • 8 bundled files

    Scripts, templates, and references the model can read while it works. Files are read-only and never executed.

  • Open source

    Published by 843645440 on GitHub. Read the source before you install it.

Installation

Install the Wechat Html Cover AI skill in TypingMind to use it with any LLM, or drop it into another agent that reads SKILL.md.

1

Install in TypingMind

TypingMind installs a skill straight from its GitHub folder — it reads SKILL.md, bundles the resource files, and stores the result locally.

  1. Open the app and go to Plugins → Skills.
  2. Choose "Install from GitHub".
  3. Paste the skill folder URL below and confirm.
    https://github.com/843645440/wechat-skill/tree/release/optional-skills/wechat-html-cover
  4. Enable the skill in any chat where you want it available.
Plugins → Skills → Add skill → From GitHub URL, then paste the folder URL and press Continue.
2

Install in another agent

Any agent that reads the Agent Skills format can use this skill — copy the folder into that agent's skills directory.

Claude Code — .claude/skills
git clone --depth 1 https://github.com/843645440/wechat-skill.git /tmp/wechat-skill
mkdir -p .claude/skills
cp -r /tmp/wechat-skill/optional-skills/wechat-html-cover .claude/skills/wechat-html-cover
Restart Claude Code after copying so it picks up the new skill.

Use it in TypingMind

Enable Wechat Html Cover in any TypingMind chat and the model takes it from there. Its name and description sit in the system prompt, and the moment a request matches, the model loads the full instructions itself — you never invoke it by hand, and it costs no tokens until it is actually used.

The model loads Wechat Html Cover on its own as soon as a request matches it.

Works with any AI model

AI skills are plain Markdown instructions rather than provider-specific code, so Wechat Html Cover is not tied to the model it was written for. Install it once in TypingMind and use it with GPT-5, Claude, Gemini, Grok, DeepSeek, Mistral, Llama, or a local model you run yourself — all on your own API keys.

  • Loaded only when it is needed

    The system prompt carries just the name and description. The instructions are fetched on the first matching request, so an idle skill costs nothing.

  • Switch models mid-chat

    Because the skill is instructions rather than code, changing model does not break it — the next model reads the same SKILL.md.

Skill instructions

This is the SKILL.md content the model loads. Read it before installing — a skill is instructions your model will follow.

微信公众号 HTML 封面

根据最终标题生成一张 1410×600 PNG。提供 signal-editorial、night-signal 与 redaction-poster 三套独立于正文主题的可切换模板；当前不在 Skill 内绑定账号。该 Skill 只负责封面，不分析或生成正文配图。

注意：流水线不直接加载本 Skill 手册。封面唯一入口是 gen_cover_image.py；正式报道和降级链仍会调用本目录的 build_cover_spec.py / render_cover.py。不要绕过 gen_cover_image.py 单独跑这两条命令。

工作流

流水线模式请勿执行下列命令。 以下仅用于单独手工生成 HTML 封面或维护模板。

  1. 自动选择一套模板；正文主题标识只保留在规格中用于追踪，不控制封面配色。同一任务恢复时沿用原模板。
  2. 让固定脚本从最终 article.md 读取标题和合适的正文短句，自动拆分为两行或三行，并生成合法重点词。不要让 Agent 手写或猜测 title_lines、highlights：
bash
python3 <SKILL_ROOT>/scripts/build_cover_spec.py \
  --article <WORK_DIR>/article.md \
  --theme <SELECTED_THEME> --template <TEMPLATE> \
  --output <WORK_DIR>/cover/cover.spec.json

规格不通过时先修正最终文章标题；不得只缩短封面文字。详细限制见 references/spec.md。

  1. 运行一次截图：
bash
python3 <SKILL_ROOT>/scripts/render_cover.py \
  --spec <WORK_DIR>/cover/cover.spec.json \
  --html-output <WORK_DIR>/cover/cover.html \
  --output <WORK_DIR>/cover/cover.png --timeout 45
  1. 使用脚本返回的调色板对比度、PNG 签名和 1410×600 尺寸校验结果做技术门禁；这些结果不代表标题已经可读。随后检查实际像素，逐字确认标题无粘连、重叠、裁切或乱码，并确认缩略图尺度仍可辨认。中文标题出现笔画膨胀或多模板共同粘连时，按 references/cjk-title-legibility.md 做封面单测与受控收敛。两类门禁都通过后才采用。

运行条件

需要 Python 3 和 Chrome/Chromium，不需要图片 API Key。脚本会自动查找常见浏览器；无法找到时设置 WECHAT_COVER_BROWSER。AppArmor / headless_shell 探针失败见 references/apparmor-headless-shell.md。

Snap/Chromium 陷阱

  • 不得对浏览器路径调用 resolve()。/snap/bin/chromium 解析后变成 /usr/bin/snap，后者不接受 --headless 参数。脚本保留原始可执行入口。
  • Snap 无法可靠读写隐藏目录（如 ~/.hermes/...）。不要围绕沙箱问题叠加 HTTP 服务、浏览器替换或多轮临时方案；先采用最小路径：在 $HOME 下创建普通非隐藏暂存目录，把输入 HTML、浏览器 profile 和输出 PNG 全部放进去，成功后再把 PNG 原子移动回工作区。具体复现与验证见 references/snap-staging-and-cover-verification.md。
  • 先做最小真实验证，再修改主脚本：用同一个浏览器入口、同一份 HTML，在非隐藏目录执行一次截图；只有确认真实 PNG 可读后才固化实现，避免把路径、浏览器和网络问题混在一起排查。
  • PNG 尺寸正确不等于内容正确。任何封面上传前都必须检查实际像素内容，确认不是 ERR_ACCESS_DENIED、ERR_FILE_NOT_FOUND、空白页或其他浏览器错误页，并确认标题完整、无乱码、无裁切溢出。只检查文件存在、字节数、PNG 签名或 1410×600 尺寸，不得报告成功。
  • 失败封面不得上传。内容未核验时停止在本地；已有有效兜底素材时使用账号默认封面，否则由草稿门禁阻止上传。

硬性边界

  • theme 必须是正文 THEMES 里的标识；调色板只提供克制强调色，封面视觉由三套模板自己决定。
  • 只使用 signal-editorial、night-signal、redaction-poster 三套注册模板；模板选择与账号映射由后续配置决定。
  • 标题必须完全位于单一高对比底色的安全区；装饰不得穿过、覆盖或裁切文字。
  • 每张封面只渲染一次，浏览器硬超时 45 秒；超时会终止浏览器进程组并返回失败。浏览器技术故障允许同一命令重试一次，不创建 V2/V3。
  • 不调用 Agnes、Baoyu 或任何生成式图片模型，不执行 AI 视觉检测。
  • 不接受任意 HTML、JavaScript、远程字体、远程图片或外部 CSS。
  • 封面失败时使用账号已有默认封面素材；两者都不可用才由草稿门禁阻止上传。

Bundled files

The model reads these on demand while the skill is loaded. They are exposed as readable files and are never executed.

Frequently asked questions

What does the Wechat Html Cover AI skill do?

使用受约束 JSON、固定 HTML/CSS 和 Chrome/Chromium 确定性生成微信公众号封面 PNG。用于完整公众号流水线必须提供 thumb_media_id，或需要准确中文标题、独立封面视觉且不调用图片模型的 1410×600 封面时；不生成正文图片。

Why use Wechat Html Cover on TypingMind?

Because you install it once and use it with any model. Wechat Html Cover is plain Markdown rather than provider-specific code, so the same skill runs on GPT-5, Claude, Gemini, Grok, or a local model — and you can switch model mid-chat without it breaking. TypingMind runs on your own API keys, so you pay providers directly instead of a per-seat subscription, and your skills and chats stay in your own storage.

How do I install Wechat Html Cover in TypingMind?

Open Plugins → Skills → Install from GitHub in TypingMind and paste https://github.com/843645440/wechat-skill/tree/release/optional-skills/wechat-html-cover. TypingMind reads its SKILL.md and bundles its files and installs it as a skill you can enable per chat.

Which AI models can use Wechat Html Cover?

Any model you connect in TypingMind. AI skills are plain Markdown instructions rather than provider-specific code, so GPT, Claude, Gemini, Grok, and local models can all load this skill when a request matches it.

How many AI models can I use with Wechat Html Cover?

As many as you like. As long as a model supports skills, you can use Wechat Html Cover with it — GPT, Claude, Gemini, Grok, DeepSeek, Mistral, Llama and more — all on TypingMind with your own API keys.

Is the Wechat Html Cover AI skill free?

It is published on GitHub by 843645440. Check the repository for licensing terms. You only pay your own AI provider for the tokens you use.

What are AI skills?

An AI skill is a reusable instruction bundle that teaches an AI model how to do one specific task. It follows the open Agent Skills format: a SKILL.md file with a name and description, plus any scripts, templates or reference files the model may need. The model reads the instructions only when your request matches the skill, so an installed skill costs nothing until it is used.

How are AI skills different from plugins or MCP servers?

A plugin or MCP server gives a model new tools to call — code that runs somewhere and returns a result. An AI skill gives the model knowledge and process instead: how to approach a task, which steps to follow, what good output looks like. Skills are plain Markdown, so they need no server, no API key and no runtime, and they work with any model.

Related AI Skills

View all
openclaw logo

Openclaw Refactor Docs

openclaw
OrganizationPopular

Refactor an existing OpenClaw docs page with source-audited preservation, restructuring, and verification.

82.2K
391K
Instructions
View
openclaw logo

Openclaw Repair Sweep

openclaw
OrganizationPopular

Run scoped OpenClaw issue/PR repair campaigns: coordinate workers, prove root causes, and land or close verified work under the requested authority.

82.2K
391K
1 files
View
openclaw logo

Openclaw Test Performance

openclaw
OrganizationPopular

Benchmark, diagnose, and optimize OpenClaw test and plugin-suite runtime, import hotspots, CPU/RSS, heap growth, and slow coverage paths.

82.2K
391K
1 files
View
openclaw logo

Openclaw Testing

openclaw
OrganizationPopular

Choose proportional OpenClaw tests and checks, diagnose failures, and route environment-sensitive or release proof to its owner.

82.2K
391K
2 files
View

Set up your own AI workspace now

Get notified about new features and future giveaways by subscribing to our newsletter 👇