By siddik-web
Convert any HTML/CSS/JS project into a production-ready WordPress Block Theme with Full Site Editing, theme.json v3, block patterns, FSE templates, and optional WooCommerce support. Includes 11 slash commands, a quality-review agent, and validation scripts.
Convert a complete HTML/CSS/JavaScript project into a production-ready WordPress block theme (Full Site Editing).
Generate an empty, valid WordPress block theme scaffold from scratch — no source HTML required.
Scaffold a custom WordPress block (block.json, edit.js, save.js or render.php, styles) ready to register inside a block theme.
Convert an existing classic WordPress theme (PHP templates, functions.php) into a Full Site Editing block theme.
Diagnose and fix WordPress block-theme failures — block validation errors, theme.json issues, missing patterns, DB template overrides, and PHP warnings.
Modifies files
Hook triggers on file write and edit operations
Uses power tools
Uses Bash, Write, or Edit tools
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
A Claude Code plugin (and standalone skill) for converting any HTML/CSS/JavaScript project into a production-ready WordPress Block Theme (Full Site Editing).
Author: Md Siddiqur Rahman Version: 2.0.0 License: MIT
Converts static HTML/CSS/JavaScript projects into complete, production-ready WordPress block themes that are:
| Command | Purpose |
|---|---|
/convert-to-wp-theme | Full conversion of HTML/CSS/JS project to complete block theme |
/scaffold-wp-theme | Create empty block theme scaffold (no source needed) |
/wp-pattern | Convert single HTML section into a registered block pattern |
/wp-theme-json | Generate theme.json from CSS custom properties / design tokens |
/wp-template | Convert single HTML page into FSE template |
/wp-block | Scaffold a custom block (block.json, edit.js, save.js/render.php, CSS) |
/wp-migrate | Migrate existing WP content (Classic Editor, ACF, widgets, CPTs, shortcodes) to block theme |
/wp-plugin-theme | Declare plugin dependencies and generate plugin-specific CSS / compatibility code |
/wp-variation | Generate a style variation (styles/*.json) — dark mode, color palette swap, font swap |
/wp-classic-to-fse | Convert an existing WordPress classic theme (PHP templates) to FSE block theme |
/wp-debug | Diagnose and fix FSE/block-theme failures — block validation errors, theme.json issues, patterns not showing, DB template overrides, PHP warnings, and more |
This repository is also a Claude Code plugin marketplace. Install it directly from GitHub:
# Run these inside Claude Code:
/plugin marketplace add siddik-web/wp-block-theme-converter
/plugin install wp-block-theme-converter@siddik-web
Installing the plugin registers everything at once:
/convert-to-wp-theme, /wp-debug, …)wp-block-theme-converter skill (auto-triggers on WordPress requests)wp-theme-reviewer agent for auditing generated themestheme.json validation hook that runs after editsManage or disable it any time with /plugin.
Download or clone this repository
Place the folder in your Claude Code skills directory:
~/.claude/skills/wp-block-theme-converter/
Restart Claude Code or run claude reload
Verify: type any of the slash commands listed above
wp-block-theme-converter.skillPlace the wp-block-theme-converter/ folder in your skills directory. Path varies by environment:
~/skills/CLAUDE_SKILLS_DIR environment variable/convert-to-wp-theme
I have a 3-page landing site for "Acme Co".
Use Vite 6, no WooCommerce.
[paste HTML/CSS/JS]
/convert-to-wp-theme
Convert my Northaven Co. eCommerce design system to a WooCommerce block theme.
Include all six aesthetics as style variations.
[attach HTML files]
/wp-pattern
Convert this hero section into a WP block pattern:
<section class="hero">
<h1>Welcome</h1>
<p>Subheading</p>
<a href="#" class="btn">CTA</a>
</section>
/wp-block
Scaffold a "Testimonial Slider" custom block with server-side rendering,
an edit.js with InspectorControls, and per-block CSS.
/wp-classic-to-fse
Convert my existing classic PHP theme to a full FSE block theme.
The theme uses a custom page builder and ACF fields.
npx claudepluginhub siddik-web/wp-block-theme-converter --plugin wp-block-theme-converterCraft production-grade WordPress sites and applications. Everything from themes and plugins to commerce and deployment.
Create WordPress block themes from simple descriptions and deploy them to a local WordPress Studio site. Generate professional themes through an interactive workflow: describe your site, choose from design options, and preview on a real WordPress installation.
Generate WordPress Gutenberg blocks using Greenshift/GreenLight. Create sections, layouts, hero sections, galleries, complete pages, and migrate old blocks to modern GreenLight Element format.
A plugin to create a new WordPress plugin
Generate WordPress Gutenberg blocks using Greenshift/GreenLight. Convert HTML to WordPress blocks, add charts, tables, dynamic content connected to WordPress query loops.
Expert WordPress diagnostics and site builder: structured investigations with intake questioning, site reconnaissance, parallel execution, findings verification, WordPress site generation as Local WP importable zips, and interactive modification sessions.