wp-block-themes

bởi wordpress

Phát triển theme block WordPress: theme.json, templates, patterns, và khắc phục sự cố Site Editor. Bao gồm chỉnh sửa theme.json (presets, settings, kiểu dáng theo từng block), templates và template parts, patterns, và các biến thể kiểu dáng trên WordPress 6.9+. Có các script phân loại để phát hiện thư mục gốc theme và cấu trúc theme block, cùng quy trình hướng dẫn tạo theme mới hoặc chuyển đổi theme cổ điển. Cung cấp quy trình gỡ lỗi cho các vấn đề về thứ bậc kiểu dáng, ghi đè tùy chỉnh của người dùng, và Site...

npx skills add https://github.com/wordpress/agent-skills --skill wp-block-themes

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.

Thêm skills từ wordpress

blueprint
wordpress
Sử dụng khi tạo, chỉnh sửa hoặc xem xét các tệp JSON blueprint của WordPress Playground. Kích hoạt khi đề cập đến blueprint, cấu hình playground hoặc các yêu cầu…
official
wordpress-router
wordpress
Phân loại mã nguồn WordPress và định tuyến đến quy trình làm việc chính xác cho plugin, theme, block và core checkouts. Chạy phân loại dự án tự động để xác định loại kho lưu trữ (plugin, theme, block theme, Gutenberg blocks, WP core) và công cụ có sẵn. Xuất kết quả phân loại và sơ đồ quyết định định tuyến đến các kỹ năng theo miền cụ thể dựa trên ý định người dùng và loại dự án. Yêu cầu quyền truy cập thư mục gốc kho lưu trữ và thao tác hệ thống tệp bash/Node; một số quy trình làm việc cần WP-CLI. Nhắm mục tiêu WordPress 6.9+ với PHP 7.2.24+;...
official
wp-abilities-api
wordpress
Đăng ký API Abilities của WordPress, hiển thị qua REST và tiêu thụ phía client cho WordPress 6.9+. Đăng ký abilities và categories trong PHP bằng wp_register_ability() và wp_register_ability_category() với ID ổn định, nhãn và siêu dữ liệu. Hiển thị abilities cho client qua các endpoint REST /wp-json/wp-abilities/v1/ bằng cách đặt meta.show_in_rest: true. Tiêu thụ abilities trong JavaScript bằng gói @wordpress/abilities để truy cập phía client và kiểm tra quyền. Yêu cầu WordPress 6.9+...
official
wp-abilities-audit
wordpress
Kiểm tra bề mặt REST của plugin WordPress và tạo ra một tài liệu kiểm tra chuẩn hóa đề xuất các đăng ký Abilities API. Tạo ra một tài liệu markdown với YAML…
official
wp-abilities-verify
wordpress
Xác minh đăng ký API Abilities của plugin WordPress: liệt kê các ability, kiểm tra rằng hành vi callback khớp với tuyên bố của từng chú thích (đối nghịch…
official
wp-block-development
wordpress
Phát triển block WordPress cho Gutenberg: siêu dữ liệu, đăng ký, hiển thị và quy trình xây dựng. Bao gồm tạo block, cấu hình block.json, hiển thị tĩnh so với động, và đăng ký PHP phía máy chủ với register_block_type_from_metadata(). Áp dụng apiVersion: 3 để tương thích với WordPress 6.9+, bao gồm hỗ trợ trình soạn thảo iframe và cách ly kiểu dáng. Xử lý tuần tự hóa thuộc tính, loại bỏ/di chuyển để ngăn lỗi "Invalid block", và kết hợp block bên trong. Bao gồm...
official
wp-interactivity-api
wordpress
Sử dụng khi xây dựng hoặc gỡ lỗi các tính năng của WordPress Interactivity API (chỉ thị data-wp-*, store/state/actions của @wordpress/interactivity, block viewScriptModule…
official
wp-patterns
wordpress
Tạo ra các block patterns WordPress chính xác về mặt kỹ thuật và có thiết kế khác biệt. Sử dụng khi tạo block patterns, các mẫu trang khởi đầu, các mẫu template, template…
official