wp-block-development

Develop and refine WordPress Gutenberg blocks with block.json and dynamic rendering.

2|Updated Aug 16, 2025
One-click install
npx skills add https://github.com/brigleb/claude --skill wp-block-development-brigleb
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wp-block-development
Source: https://github.com/brigleb/claude/tree/main/skills/wp-block-development
Command: npx skills add https://github.com/brigleb/claude --skill wp-block-development-brigleb

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the process of developing, updating, and debugging WordPress Gutenberg blocks, ensuring compatibility and adherence to best practices.

Core Features & Use Cases

  • Block Creation: Scaffold new blocks using modern tooling like @wordpress/create-block.
  • Metadata Management: Safely update block.json for attributes, scripts, styles, and rendering.
  • Dynamic Rendering: Implement server-side rendering for blocks.
  • Compatibility: Ensure blocks work with current and future WordPress versions, including API version 3 requirements.
  • Use Case: You need to add a new custom block to a WordPress theme that displays recent posts with specific filtering options. This Skill will guide you through scaffolding the block, defining its attributes, setting up dynamic rendering, and ensuring it's compatible with WordPress 6.9+.

Quick Start

Use the wp-block-development skill to create a new WordPress block for a custom plugin.

Frequently Asked Questions about wp-block-development

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a new WordPress Gutenberg block from scratch?

To scaffold a WordPress Gutenberg block, this Skill guides you through using modern tooling like `@wordpress/create-block` to generate the initial structure, manage `block.json` metadata, and register attributes for WordPress 6.9+ compatibility.

How do I implement dynamic rendering for a custom WordPress block?

Dynamic rendering for a custom WordPress block is implemented using server-side PHP rendering callbacks. This Skill provides guidance on setting up these callbacks to fetch and display data, such as recent posts with filtering options, without relying on static block content.

Why does my Gutenberg block show as invalid during attribute serialization?

Invalid Gutenberg blocks during attribute serialization occur when block markup does not match expected `block.json` definitions. This Skill addresses common serialization issues and API versioning requirements to ensure your blocks remain valid in WordPress 6.9+.

Does my custom block need API version 3 for WordPress 6.9 compatibility?

Yes, ensuring compatibility with WordPress 6.9+ requires adherence to API version 3 requirements. This Skill helps you update block metadata and rendering logic to meet these modern API versioning standards and avoid deprecated functionality.

What is the best way to update block.json for attributes and scripts?

The best way to update `block.json` is by safely modifying its definitions for attributes, scripts, styles, and rendering methods. This Skill streamlines metadata management to ensure your Gutenberg block's configuration aligns with current WordPress best practices.