All skills
automattic avatar

/wp-block-themes

@95e374f official
by automatticautomattic/agent-skills211 stars
37

Use when developing WordPress block themes: theme.json (global settings/styles), templates and template parts, patterns, style variations, and Site Editor troubleshooting (style hierarchy, overrides, caching).

Use this Skill: https://skilld.dev/gh/automattic/agent-skills/wp-block-themes

This session only. Nothing lands on disk.

SKILL.md

≈57 tokens always: the name and description. ≈896 when used: this file. ≈1.4k more on demand in 6 files.

WP Block Themes

When to use

Use this skill for block theme work such as:

  • editing theme.json (presets, settings, styles, per-block styles)
  • adding or changing templates (templates/*.html) and template parts (parts/*.html)
  • adding patterns (patterns/*.php) and controlling what appears in the inserter
  • adding style variations (styles/*.json)
  • debugging “styles not applying” / “editor doesn’t reflect theme.json”

Inputs required

  • Repo root and which theme is targeted (theme directory if multiple exist).
  • Target WordPress version range (theme.json version and features vary by core version).
  • Where the issue manifests: Site Editor, post editor, frontend, or all.

Procedure

0) Triage and locate block theme roots

  1. Run triage:
    • node skills/wp-project-triage/scripts/detect_wp_project.mjs
  2. Detect theme roots + key folders:
    • node skills/wp-block-themes/scripts/detect_block_themes.mjs

If multiple themes exist, pick one and scope all changes to that theme root.

1) Create a new block theme (if needed)

If you are creating a new block theme from scratch (or converting a classic theme):

  • Prefer starting from a known-good scaffold (or exporting from a WP environment) rather than guessing file layout.
  • Be explicit about the minimum supported WordPress version because theme.json schema versions differ.

Read:

  • references/creating-new-block-theme.md

After creating the theme root, re-run detect_block_themes and continue below.

2) Confirm theme type and override expectations

  • Block theme indicators:
    • theme.json present
    • templates/ and/or parts/ present
  • Remember the style hierarchy:
    • core defaults → theme.json → child theme → user customizations
    • user customizations can make theme.json edits appear “ignored”

Read:

  • references/debugging.md (style hierarchy + fastest checks)

3) Make theme.json changes safely

Decide whether you are changing:

  • settings (what the UI allows): presets, typography scale, colors, layout, spacing
  • styles (how it looks by default): CSS-like rules for elements/blocks

Read:

  • references/theme-json.md

4) Templates and template parts

  • Templates live under templates/ and are HTML.
  • Template parts live under parts/ and must not be nested in subdirectories.

Read:

  • references/templates-and-parts.md

5) Patterns

Prefer filesystem patterns under patterns/ when you want theme-owned patterns.

Read:

  • references/patterns.md

6) Style variations

Style variations are JSON files under styles/. Note: once a user picks a style variation, that selection is stored in the DB, so changing the file may not “update what the user sees” automatically.

Read:

  • references/style-variations.md

Verification

  • Site Editor reflects changes where expected (Styles UI, templates, patterns).
  • Frontend renders with expected styles.
  • If styles aren’t changing, confirm whether user customizations override theme defaults.
  • Run the repo’s build/lint scripts if assets are involved (fonts, custom JS/CSS build).

Failure modes / debugging

Start with:

  • references/debugging.md

Common issues:

  • wrong theme root (editing an inactive theme)
  • user customizations override your defaults
  • invalid theme.json shape/typos prevent application
  • templates/parts in wrong folders (or nested parts)

Escalation

If upstream behavior is unclear, consult canonical docs:

  • Theme Handbook and Block Editor Handbook for theme.json, templates, patterns, and style variations.

Source: SKILL.md on GitHub

1 warning16d4 checks · Risk SAFE
  • Gen Agent Trust Hub16d

    The skill is safe and designed for WordPress block theme development. It includes standard documentation and a script that scans local directories to identify block themes based on the presence of theme.json and related folders. No security risks or malicious behaviors were detected.

  • Socket16d

    No alerts

  • Snyk16d

    Risk: LOW · No issues

  • Runlayer7mo

    7/8 files flagged

Signed by skilld at 95e374f. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 5 months ago.

Dormantupdated 9 months ago
Other metadata
compatibility
Targets WordPress 6.9+ (PHP 7.2.24+). Filesystem-based agent with bash + node. Some workflows require WP-CLI.
  • wordpress
  • block-themes
  • theme-json
  • site-editor
  • templates
  • patterns
  • style-variations
  • php

README badge

README badge for automattic/agent-skills/wp-block-themes

Guides WordPress block theme development with theme.json editing, templates, template parts, patterns, and style variations for WordPress 6.9+. Use this when building or debugging block themes, including style hierarchy troubleshooting and Site Editor issues.

Generated from the current SKILL.md.

Does this skill work with WordPress versions before 6.9?
No. The skill targets WordPress 6.9+ (PHP 7.2.24+). Block theme features and theme.json schema versions vary significantly across core releases, so earlier versions are not supported.
Can I use this skill to convert a classic theme to a block theme?
Yes. The skill includes guidance in `references/creating-new-block-theme.md` for converting classic themes, though it recommends starting from a known-good scaffold or exporting from a WP environment rather than building from scratch.
What should I do if theme.json changes don't appear in the Site Editor or frontend?
Start with `references/debugging.md`. Common causes are editing the wrong theme root, invalid theme.json syntax, user customizations overriding theme defaults, or caching. The skill covers the style hierarchy (core defaults → theme.json → child theme → user customizations) to help diagnose which layer is controlling the output.
Does this skill handle block theme assets like fonts and custom CSS builds?
The skill covers theme.json, templates, patterns, and style variations but expects you to run the repo's own build/lint scripts if custom assets (fonts, compiled CSS/JS) are involved.

Generated from the current SKILL.md. These answers refresh after source changes.