WordPress.org

Jason Crist

Echo

jeffikus

Ben Dwyer

Cullen Whitmore

Matias Benedetto

Vicente Canales

Madhu Dollu

Jeff Ong

Sarah Norris

Maggie Cabrera

<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

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 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

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!

A WordPress plugin to create block themes.

Hans-Gerd Gerhards

<p>Options:</p>
<ul>
<li>Set height for header</li>
<li>Set height for shrinking header</li>
<li>Set Logo shrinking factor </li>
<li>Set shrinked Logo left (added in Version 1.3)</li>
<li>Set Animation duration (seconds) for shrinking header</li>
<li>Option to set a breakpoint for navigation (added in Version 1.1)</li>
<li>Option to set Off-Canvas (added in Version 1.2)</li>
<li>Option for the speed of the Off-Canvas fade-in (added in Version 1.3.1)</li>
<li>Option to disable inner spacing (padding) in header (added in Version 1.4)</li>
<li>Option to enable Text  below mobile Icon and display larger mobile menu Icon (Hamburger) – better for accessibility reasons (added in Version 1.4)</li>
<li>Option to Label Text  (added in Version 1.4)</li>
<li>Option: Menu does not appear as sticky on mobile devices – may be better for accessibility reasons (added in Version 1.4.1)</li>
</ul>
<p>Dynamic Header & Navigation for Block Themes (Previous name of the plugin: Shrinking Logo Sticky Header) is a lightweight WordPress plugin developed specifically as a navigation solution for most Block Themes.<br />
It adds a modern sticky header with smooth, animated shrinking effects for both the header and the site logo.<br />
As users scroll down the page, the header and logo automatically reduce in size, maximizing on-screen space and keeping navigation easily accessible without disrupting the browsing experience.</p>
<p>The plugin allows you to individually configure the heights for the header and logo in both their normal and shrunken states, giving you full control over your site’s appearance.<br />
These settings can be easily adjusted to match your branding or design preferences.</p>
<p>One of the key advantages of Dynamic Header & Navigation for Block Themes is its simplicity:<br />
After activation, the sticky and shrinking effects work in principle immediately – no additional setup or configuration is required.<br />
This makes it ideal for users who want a professional, dynamic header effect without dealing with complex options or custom code.</p>
<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/1_z6bQedAt8?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>
<h3>Translations</h3>
<ul>
<li>(French): Thanks to <a href="https://profiles.wordpress.org/patricia70/" rel="nofollow ugc">Patricia BT</a></li>
</ul>


Dynamic Header & Navigation for Block Themes

Animated shrinking header, responsive shrinking logo, custom breakpoints and off-canvas navigation – navigation solution for block themes.

Create Block Theme vs Dynamic Header & Navigation for Block Themes