What are WordPress development contracts?

They are a set of structural and coding rules that ensure every component in a WordPress theme—such as blocks and patterns—is built consistently, accessibly, and according to modern FSE standards.

How does it handle styling and CSS?

The skill enforces the use of WordPress theme.json tokens and BEM naming conventions while blocking the use of !important tags, ID selectors, and hardcoded hex colors.

Is this compatible with Classic WordPress themes?

This skill is optimized for modern WordPress development, specifically focusing on Gutenberg blocks, Block Patterns, and Full Site Editing (FSE) architectures.

Does this skill help with web accessibility?

Yes, it specifically enforces WCAG AA standards, including mandatory skip links, ARIA attributes for navigation, and minimum touch target sizes for interactive elements.

WordPress Theme Development Contracts

Name: WordPress Theme Development Contracts
Author: theflysurfer

bytheflysurfer

コンテンツ管理

Enforces standardized development patterns and accessibility rules for custom WordPress Gutenberg themes.

概要

This skill provides a comprehensive set of development contracts to ensure consistency, accessibility, and maintainability within WordPress themes, specifically tailored for Gutenberg block development and Full Site Editing (FSE). It automates the adherence to strict coding standards for blocks, patterns, headers, and footers, integrating design tokens and WCAG AA accessibility requirements directly into the development workflow to prevent technical debt and ensure a high-quality frontend experience.

主な機能

Implements accessible header components with glassmorphism and skip links
Prevents CSS anti-patterns by enforcing BEM naming and theme.json tokens
Standardizes responsive footer grids with integrated legal and social structures
0 GitHub stars
Enforces standardized Gutenberg block structures using block.json and React
Validates block pattern composition to ensure zero additional CSS usage

ユースケース

Building accessible, mobile-first WordPress headers and footers
Developing custom, production-ready Gutenberg blocks with PHP and React
Ensuring theme-wide design consistency through strict CSS token enforcement

概要

主な機能

Implements accessible header components with glassmorphism and skip links
Prevents CSS anti-patterns by enforcing BEM naming and theme.json tokens
Standardizes responsive footer grids with integrated legal and social structures
0 GitHub stars
Enforces standardized Gutenberg block structures using block.json and React
Validates block pattern composition to ensure zero additional CSS usage

ユースケース

Building accessible, mobile-first WordPress headers and footers
Developing custom, production-ready Gutenberg blocks with PHP and React
Ensuring theme-wide design consistency through strict CSS token enforcement