add-variation

Generate WordPress core block variation scaffolding with registerBlockVariation code patterns.

12|9|Updated Oct 23, 2025
One-click install
npx skills add https://github.com/jnealey88/designsetgo --skill add-variation
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: add-variation
Source: https://github.com/jnealey88/designsetgo/tree/main/.claude/skills/add-variation
Command: npx skills add https://github.com/jnealey88/designsetgo --skill add-variation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the creation of WordPress core block variations by scaffolding a consistent variation structure, reducing manual setup time and ensuring best practices.

Core Features & Use Cases

  • Guides users to specify core block, variation name, description, default layout, and icon
  • Generates variation skeleton using registerBlockVariation with name, title, description, icon, and attributes
  • Updates project wiring by placing files under src/variations/[block-name]-variations/ and importing in src/index.js for activation

Quick Start

Ask for the core block, the variation name and description, the default layout and attributes, and the icon to generate a ready-to-use variation.

Frequently Asked Questions about add-variation

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

FAQPage Schema
How do I create a WordPress block variation with registerBlockVariation?▼

To create a WordPress block variation, use registerBlockVariation to define preset attributes, innerBlocks, and icons. The tool scaffolds the variation files under src/variations/[block-name]-variations and updates index.js for activation.

What is a WordPress Gutenberg block variation and when do I need one?▼

A WordPress Gutenberg block variation is a pre-configured version of an existing core block with preset attributes, innerBlocks, and icons. You need one to provide reusable block setups without building entirely new blocks from scratch.

How do I set up the folder structure for a Gutenberg block variation?▼

The correct folder structure for a Gutenberg block variation requires placing files under src/variations/[block-name]-variations/. You must also add an import in src/index.js to activate the variation within your project wiring.

Can I add preset attributes and innerBlocks to a core block variation?▼

Yes, you can add preset attributes and innerBlocks to a core block variation. The scaffolding process guides you to specify the core block, variation name, description, default layout, attributes, and icon to generate the configuration.

What do I need to provide to scaffold a WordPress block variation?▼

You need to provide the target core block, the variation name, a description, the default layout and attributes, and an icon. This input generates a ready-to-use variation skeleton with proper project wiring.

Why are my WordPress block variations not showing up in the block editor?▼

Block variations may not appear if the project wiring is incomplete. Ensure the variation is placed under src/variations/[block-name]-variations and that src/index.js contains the required import statement to activate the variation.