WordPress.org

Jason Crist

Cullen Whitmore

jeffikus

Ben Dwyer

Echo

Sarah Norris

Maggie Cabrera

Jeff Ong

Matias Benedetto

Madhu Dollu

Vicente Canales

<p>This plugin allows you to:</p>
<ul>
<li>Create a blank theme</li>
<li>Create a new theme based on the currently active theme</li>
<li>Create a child theme of the active parent theme</li>
<li>Create a new style variation</li>
<li>Export a theme</li>
<li>Save user changed templates and styles to the active theme</li>
</ul>
<p>All newly created themes or style variations will include changes made within the WordPress Editor.</p>
<p>This plugin also makes several changes to the contents of a theme, including:</p>
<ul>
<li>Adds all images used in templates to the theme’s <code>assets</code> folder.</li>
<li>Ensures the block markup used in templates and patterns is export-ready.</li>
<li>Ensures most strings used in templates and patterns are translate-ready.</li>
</ul>
<p><em>Disclaimer:</em> The Create Block Theme plugin offers critical developer-friendly features; you can think of it as a Development Mode for WordPress, and you should <em>keep in mind that changes made through this plugin could change your site and/or theme permanently</em>.</p>
<p>(Make sure you know what you’re doing before hitting that ‘Save’ button 😉)</p>
<h4>Step 1 – Setup</h4>
<p>Install and activate the <a href="https://wordpress.org/plugins/create-block-theme" rel="ugc">Create Block Theme</a> plugin.</p>
<p>There will be a new panel accessible from the WordPress Editor, which you can open by clicking on a new icon to the right of the “Save” button, at the top of the Editor.</p>
<h4>Step 2 – Style Customizations</h4>
<p>Make changes to your site styles, fonts and templates using the Editor.</p>
<h4>Step 3 – Export</h4>
<p>Still in the WordPress Editor, navigate to the Create Block Theme menu at the top of the Editor.</p>
<p>To save recent changes made in the Editor to the currently active theme:</p>
<ul>
<li>Select “Save Changes” to save any recent changes to the currently active theme.</li>
</ul>
<p>To install and uninstall fonts:</p>
<ul>
<li>Install and activate a font from any source using the WordPress Font Library.</li>
<li>Select “Save Changes To Theme” and select “Save Fonts” to save all of the active fonts to the currently active theme. These fonts will then be activated in the theme and deactivated in the system (and may be safely deleted from the system).</li>
<li>Any fonts that are installed in the theme that have been deactivated with the WordPress Font Library will be removed from the theme.</li>
</ul>
<p>or export the theme:</p>
<ul>
<li>Select “Export Zip” to export the theme as a zip file.</li>
</ul>
<p>To edit the theme metadata:</p>
<ul>
<li>Select “Edit Theme Metadata” to edit the metadata for the theme. These details will be used in the style.css file.</li>
</ul>
<p>To inspect the active theme’s theme.json contents:</p>
<ul>
<li>Select “Inspect Theme JSON”</li>
</ul>
<p>To create a new blank theme:</p>
<ul>
<li>Select “Create Blank Theme”</li>
<li>Supply a name for the new theme (and optional additional Metadata)</li>
<li>Click “Create Blank Theme”</li>
</ul>
<p>To create a variation:</p>
<ul>
<li>Select “Create Theme Variation”</li>
<li>Provide a name for the new Variation</li>
<li>Click “Create Theme Variation”</li>
</ul>
<p>To create a new Clone of the current theme or to create a Child of the current theme:</p>
<ul>
<li>Click “Create Theme”</li>
<li>Click “Clone Theme” to create a new Theme based on the active theme with your changes</li>
<li>Click “Create Child Theme” to create a new Child Theme with the active theme as a parent with your changes</li>
</ul>
<p>Many of these options are also available under the older, deprecated Create Block Theme page under Appearance > Create Block Theme.</p>
<h3>General Troubleshooting</h3>
<p>If you are having problems, please try the following:</p>
<ul>
<li>Make sure you have the latest version of WordPress installed.</li>
<li>Make sure you have the latest version of the plugin installed.</li>
<li>Deactivate all plugins and see if this resolves the problem. If this works, re-activate the plugins one by one until you find the problematic plugin(s).</li>
<li>Switch the theme to the default theme to rule out any theme-related problems.</li>
<li>Check the <a href="https://wordpress.org/support/plugin/create-block-theme/" rel="ugc">Support forum</a> for similar issues.</li>
</ul>
<h3>I’m getting a corrupt zip file when I export my theme</h3>
<ul>
<li>First follow the general troubleshooting steps above.</li>
<li>Please make sure you <code>WP_DEBUG</code> setting in your <code>wp-config.php</code> file is set to <code>false</code> like this: <code>define( 'WP_DEBUG', false );</code>.</li>
<li>If your theme includes PHP files, ensure those files do <strong>not</strong> use PHP closing tags <code>?></code> at the end of the file. If they do, remove them.</li>
</ul>


Create Block Theme

This plugin is the perfect way to get started building block themes. You can edit an existing theme in the editor, and export your changes to a new theme or a  child theme. 

Perfect for the new block theme developer

The direction this plugin is going is fantastic and really empowers no-code/low-code theme designers. Would love to see it integrated in Core at some point, but having this functionality in a separate feature plugin is a great first step.

Fantastic already, but lots of potential

This plugin will let you create a block theme easily. It generates all the code so you can focus on design. I hope the authors will keep up the good work on this plugin and add even more features in the future.

Works perfectly!


Love it, and it's finally a clean and easy to use solution to send our theme users to, if they want to add a custom font or create a child theme for any purpose really.It's also great to add fonts to our themes, although it would be great, if it would work with variable fonts and WOFF2.


What did you do without this before 😍


I love this. In just about a blink of the eye, I can create my own custom version of an already-built theme. Sweet!


Easy Peasy


Thanks for this. It works well. It's exciting that block theme design is low code. This plugin makes it even more low code.


Kind of a dream


As someone learning how to create block themes, I appreciate that this plugin exists to help fill the gap in knowledge!



I appreciate this plugin


After hours of setting up my blog with blocks I realized: I should really use a child theme. A practice I forgot after years of not dealing with wordpress. When I created the most basic child theme it did not inherit my settings either. This plugin did exactly that. It made a minimal child theme with all my settings intact. My only problem with it, that it instantly turn the child theme to be active and that is a risky behavior, but it did not cause problems.


just great!


I have been using this plugin since its inception.The first versions lacked functionality, there was a conceptual change in the paradigm and approach, now it is a very convenient solution for configuring and saving changes to the file system during the development of WordPress Gutenberg FSE sites.



I am grateful to the developers for such a tool that allows you to solve many tasks without unnecessary effort, I recommend it to all developers who are starting their journey to FSE development.



I will add even more: 



I have Clients, whos seen this tool at the development stage, asked to leave it for their use and they independently make global changes, after which they successfully export (commit) to the file system and these are people who have nothing to do with the code.



They simply fell in love with Gutenberg, just like me, and work with it with love and pleasure.


A good solution for WordPress developers and not only.

A WordPress plugin to create block themes.

4wpdev

Anatoliy Dovgun

<h4>Demo</h4>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/JDGOF2B2zqQ?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>4WP Style Switcher reads <strong>style variations</strong> from the active block theme (<code>theme.json</code> and <code>/styles/*.json</code>).</p>
<p>A plugin by <a href="https://4wp.dev/" rel="nofollow ugc">4wp.dev</a>. <strong>4WP</strong> is our project brand; the letters “WP” appear only as part of that brand name, not as a reference to WordPress. This plugin is not affiliated with, endorsed, or sponsored by WordPress.</p>
<p>Source code and releases: <a href="https://github.com/4wpdev/4wp-style-switcher" rel="nofollow ugc">github.com/4wpdev/4wp-style-switcher</a></p>
<h4>Development</h4>
<p>Human-readable PHP source is in the public GitHub repository above. The plugin ZIP includes <code>src/</code> (PSR-4 autoload via <code>src/Autoload.php</code> when <code>vendor/</code> is absent). No npm build step — front-end scripts ship as plain JS in <code>assets/</code>.</p>
<p><strong>Live demo (WordPress Playground):</strong> https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/4wpdev/4wp-style-switcher/v1.0.0/.wordpress-org/assets/blueprints/blueprint.json</p>
<p>The demo site <strong>Style Switcher</strong> uses Twenty Twenty-Five: About, Morning, Afternoon, and Evening pages with per-page styles, A/B light vs dark, a bottom-right visitor switcher, and Light/Dark in the header and footer menus.</p>
<p><strong>Page style (editor)</strong> — pick a variation for a page; optionally lock it so visitors cannot override it.</p>
<p><strong>Frontend switcher</strong> — visitors choose from allowed variations; the choice is stored in localStorage and synced to a cookie for server-side rendering.</p>
<p><strong>Light / Dark (navigation block)</strong> — add the Light/Dark block inside Navigation; map two variations (sun/moon icons).</p>
<p><strong>A/B testing</strong> — split new visitors between two variations; daily aggregate stats monitor the traffic split.</p>
<h4>Privacy</h4>
<p>When the visitor switcher or A/B testing is enabled, the plugin may store the selected style variation in a browser cookie (<code>forwp_ss_style</code>) and in localStorage on the visitor device. No personal data is sent to third-party services. A/B stats are aggregated counts stored in your WordPress database.</p>
<h3>Blocks</h3>
<p>This plugin provides 1 block.</p>
<ul>
<li>
<p><strong>Light / Dark</strong> — menu toggle between two mapped theme style variations (sun/moon icons).<strong>Hooks (developers)</strong></p>
</li>
<li>
<p><code>forwp_style_switcher_variations</code> — filter theme variation list.</p>
</li>
<li><code>forwp_style_switcher_ab_assigned</code> — after A/B cohort assignment.</li>
<li><code>forwp_style_switcher_analytics_track</code> — analytics events.</li>
<li><code>forwp_style_switcher_ab_assignment_enabled</code> — filter A/B assignment.</li>
</ul>


4WP Style Switcher

Apply theme.json style variations per page or let visitors switch styles on the frontend (FSE block themes).

Create Block Theme vs 4WP Style Switcher