Gov Service Wechat Layout

民生政务公众号 · 排版模板

Provide nine content-type layout templates plus a swappable theme-color model for 民生政务 WeChat official accounts (社保/医保/公积金/税务/民政/公安政务等). Output is structured HTML an editor pastes directly into the WeChat official-account editor — formatting is preserved without 135 — or imports into 秀米/135 for richer visuals.

When to use

Trigger when the request is to lay out, format, or apply a template to an article for a 社保 / 政务公众号, e.g. "给这篇社保推文排版"、"套用办事指南模板"、"帮我把这篇政策解读排成公众号格式". Do not trigger for 135 one-click publish packaging (use a 135-publisher skill for that); this skill produces the layout structure and color.

Content-type routing

Identify the article's content type, then load the matching template from assets/:

If a piece fits two types, choose the one matching its primary purpose (e.g. a new policy that is mostly a how-to → C; mostly myth-busting → A).

Apply the color slot model

Use four color roles, but distinguish signals by form, not just hue — so a single theme color never reads as "all red". See references/color-slot-model.md for the full spec.

• 主题色 brand #ff6d4d（A2 默认 #438EDB 社保蓝）— swappable. Appears in three distinct forms so it never collides: (1) solid bars = big section dividers — the only full-strength fill, default text-length for high-saturation themes; (2) left-border stripes on subtitle chips / content boxes; (3) inline bold words = content emphasis. Structural only.
• 子标题芯片 — neutral #F5F6F8 background, light-red bold text #E0494D, theme left-border stripe. Reads as a "label". Signal lives on the chip; body text beneath stays plain (no box, no color border) — use inline ✓/❎/• markers to tell items apart.
• 警示红 warn #ff0000 — fixed; used as inline red emphasis (❎ 错误认知 label, 红字关键词) and as the red left-border on Q&A question chips. 警示 / 提醒类（请注意/注意！/IP郑重提醒/温馨提醒/温馨提示）走 提醒卡：外层用 容器（微信后台会过滤 的 border，`` 边框接受度更高），灰底 #F5F6F8 + 浅灰细线边框 1px solid #E5E6EB + 圆角 8px、无亮色边；标题浅红字 #E0494D + 可选 💡 图标 + 可加主题色下划线（与字异色、padding-bottom 留呼吸感），正文深灰纯文本、不整段/整行同色。提醒卡与子标题芯片不同款（后者满灰底+主题色边）。
• 正确蓝 correct #5f9cef — fixed; ✓ correct conclusions / positive findings (可算, 可认定, 正确办理方式). The only off-hue positive signal, naturally distinct.

Pick one theme color per article from the candidate library in references/color-slot-model.md (default #ff6d4d 橙红；A2 新政解读默认 #438EDB 社保蓝). To recolor, replace the placeholder theme color in the chosen template (A2: #438EDB; others: #ff6d4d) with the article's theme color; never replace #ff0000 or #5f9cef (both fixed semantic colors). Run scripts/apply_theme_color.py --input --color to do this deterministically, or instruct the editor to find-replace in 秀米/135's one-click theme-color feature.

Section-title background width: big section bars default to text-length mode (background hugs the title text — far less visual intensity) for the default high-saturation themes (橙红/玫红/粉红/橙); cool themes (blue used as theme) may use full-width. Exact CSS in references/component-library.md 「小标题底色 · 宽度模式」.

Fill placeholders

Templates are de-identified. Replace these placeholders with the account's real values before output:

• {{IP名}} — persona name (e.g. 顺小保 / 小保 / 社保小助手)
• {{城市}} — city (e.g. 佛山)
• {{热线}} — consultation hotline (e.g. 12345)
• {{公众号名}} — official-account name (e.g. 顺德社保)
• {{机构全称}} — issuing agency full name
• 【…】 — per-article content placeholders (title, dates, amounts, fields)

Keep the fixed footer wording pattern: 温馨提示 + 尊敬的参保人……拨打{{城市}}{{热线}}热线……. Never fabricate phone numbers, document numbers, QR codes, or links — flag missing ones as 需编辑补充.

Workflow

1. Determine content type → load the matching assets/template-*.md.html.
2. Apply theme color (replace the placeholder theme color — A2: #438EDB; others: #ff6d4d) per article; keep warn + correct fixed.
3. Fill {{…}} account placeholders and 【…】 content placeholders from the approved copy. Preserve approved wording, dates, amounts, eligibility, and legal names exactly.
4. Return the finished HTML for the editor to paste/import. Optionally note which modules to repeat (误区框 ×N, 案例框 ×N, Q&A ×N).

For the methodology behind the layouts (5-step style-replication SOP, dimension table) and the full component/typography spec, read references/layout-sop.md and references/component-library.md before non-trivial customization.

发布路径：直接粘贴 vs 135

Templates use inline styles only — no `` blocks, no class, no CSS variables, no scripts, no external fonts (verified). This is exactly the subset the WeChat official-account editor preserves on paste.

• 直接粘贴进公众号后台（推荐，无需 135）：复制渲染好的 HTML → 公众号后台图文编辑器粘贴 → 格式基本不变 → 发布。换主题色后即可用。适用于本 skill 的全部 9 类模板。
• 走 135/秀米（可选，要富视觉时）：若需米色网格、卡通插画、复杂卡片等超越内联样式能表达的视觉效果，导入 135/秀米编辑器内排版，再用其"同步到公众号"功能发布。注意：不要把 135/秀米导出的 HTML 直接粘贴进后台——它们靠 class+`` 坃局，会被微信剥离导致"css 变形"。

Tradeoff: inline-style-only = 保守视觉 + 直接可发布；135/秀米 = 富视觉 + 必须在编辑器内同步。本 skill 选前者，换取"粘贴即发布"。

Resources

• assets/template-*.md.html — nine de-identified layout templates with the color slot applied.
• references/color-slot-model.md — color roles, candidate library, recolor methods.
• references/component-library.md — signature components, type scale, fonts, per-type skeletons.
• references/layout-sop.md — the 5-step methodology and dissection dimensions for extending to new content types.
• README.md — 安装与使用说明（含发布路径详解），随 skill 分发。
• scripts/apply_theme_color.py — deterministic theme-color find-replace utility.