convert-to-wp-theme
Convert a complete HTML/CSS/JavaScript project into a production-ready WordPress block theme (Full Site Editing).
Declare plugin dependencies and generate plugin-specific CSS and compatibility code for a block theme.
> /plugin marketplace add siddik-web/wp-block-theme-converter > /plugin install wp-block-theme-converter@siddik-web
How it fires
How this command gets triggered: by you, by Claude, or both.
/wp-plugin-themeContext preview
What this command does when you run it.
Declare plugin dependencies and generate plugin-specific CSS and compatibility code for a block theme.
description: Declare plugin dependencies and generate plugin-specific CSS and compatibility code for a block theme.
**Purpose:** Extend a block theme to declare plugin dependencies, add plugin-specific CSS stubs, and generate compatibility code for the most common WordPress plugins (Yoast SEO, WPForms, Gravity Forms, ACF, Jetpack, WooCommerce, and others).
User types `/wp-plugin-theme` OR asks for plugin compatibility in their theme, OR their conversion source HTML references plugin output (e.g., a contact form, SEO breadcrumbs, a review widget).
Ask (or infer from source HTML / context):
| Question | Why it matters | |----------|---------------| | Which plugins are **required** (theme breaks without them)? | Go into `required_plugins` declaration | | Which plugins are **recommended** (optional features)? | Go into `recommended_plugins` declaration | | Which plugins is the user already using? | Determines which CSS stubs to generate | | Any page builder plugins (Elementor, Divi)? | Different compatibility approach |
**Common plugins to ask about:**
PLUGIN COMPATIBILITY PLAN ========================== | Plugin | Status | What theme generates | |---------------------|-------------|--------------------------------------------------| | Yoast SEO | Required | Breadcrumb template part, OG image size, CSS stub | | WPForms | Required | Form CSS stub, accessibility overrides | | ACF | Required | Block Bindings source, post meta registration | | Gravity Forms | Recommended | CSS stub, AJAX compat note | | Jetpack | Recommended | CSS stub for sharing buttons |
Show plan, get confirmation before generating files.
WordPress 6.5+ supports declaring required plugins in `style.css` header. Additionally use the TGMPA pattern for backward compatibility.
**style.css header addition:**
/*
* Theme Name: {{Theme Name}}
* ...
* Requires Plugins: {{plugin-slug}}, {{plugin-slug-2}}
*/Slugs must match the plugin's **WordPress.org directory slug** — the folder name under `wp-content/plugins/`. For example, WPForms is `wpforms-lite` (free) or `wpforms` (pro); ACF is `advanced-custom-fields` (free) or `advanced-custom-fields-pro` (pro). Verify slugs at `wordpress.org/plugins/{{slug}}` before committing.
> **ACF Block Bindings version requirement:** Using ACF fields with the Block Bindings API requires **ACF PRO 6.3+** (for native binding support) or the custom `register_block_bindings_source()` approach shown in `commands/wp-migrate.md`. The Block Bindings API itself requires **WordPress 6.5+**. Always check both version constraints before declaring ACF as a required plugin for binding-dependent features.
**TGMPA-style helper in `inc/plugin-dependencies.php`:**
<?php
/**
* Plugin dependency declarations.
*
* Note: WordPress 6.5+ reads "Requires Plugins" from style.css header.
* This file provides a user-facing admin notice for older WP versions
* and for plugins not on WordPress.org.
*/
function {{theme_slug_underscored}}_check_plugin_dependencies(): void {
if ( ! is_admin() ) {
return;
}
$required = array(
array(
'slug' => '{{plugin-slug}}',
'name' => '{{Plugin Name}}',
'version' => '{{min-version}}',
),
);
$missing = array();
foreach ( $required as $plugin ) {
if ( ! is_plugin_active( $plugin['slug'] . '/' . $plugin['slug'] . '.php' )
&& ! is_plugin_active( $plugin['slug'] . '/index.php' ) ) {
$missing[] = $plugin['name'] . ' (v' . $plugin['version'] . '+)';
}
}
if ( ! empty( $missing ) ) {
add_action( 'admin_notices', function() use ( $missing ) {
printf(
'<div class="notice notice-error"><p>%s</p></div>',
sprintf(
/* translators: %s: list of required plugins */
esc_html__( '{{Theme Name}} requires the following plugins: %s', '{{text-domain}}' ),
'<strong>' . esc_html( implode( ', ', $missing ) ) . '</strong>'
)
);
} );
}
}
add_action( 'admin_init', '{{theme_slug_underscored}}_check_plugin_dependencies' );Add to `functions.php`:
require_once get_template_directory() . '/inc/plugin-dependencies.php';
Output only the files relevant to the plugins identified in Step 1.
---
**Breadcrumb template part** (`parts/breadcrumbs.html`):
<!-- wp:group {"tagName":"nav","ariaLabel":"Breadcrumb","className":"site-breadcrumbs","layout":{"type":"constrained"}} -->
<nav class="wp-block-group site-breadcrumbs" aria-label="<?php esc_attr_e( 'Breadcrumb', '{{text-domain}}' ); ?>">
<!-- wp:html -->
<?php
if ( function_exists( 'yoast_breadcrumb' ) ) {
yoast_breadcrumb( '<p class="breadcrumb">', '</p>' );
} elseif ( function_exists( 'rank_math_the_breadcrumbs' ) ) {
rank_math_the_breadcrumbs();
} elseif ( function_exists( 'seopress_display_breadcrumbs' ) ) {
seA 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 License: MIT
Repo: siddik-web/wp-block-theme-converter
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.
Migrate existing WordPress content (Classic Editor, ACF, widgets, CPTs, shortcodes, page builders) into a block theme.