There’s now several types of WordPress theme available for your WordPress website. WordPress adjusts its functionality depending on what type of theme you are using, so you may need to test whether you have a block theme or a classic theme. In this post, we’ll look at methods to test whether you have a WordPress block theme.
WordPress block theme vs classic theme
What is a block theme?
A block theme is a fairly new type of theme for WordPress websites. They make use of the latest block editor features WordPress offers, often referred to as Gutenberg. Block themes are at the cutting of edge of how the WordPress CMS is intended to assemble webpages and manage content on websites.
They provide support for the the WordPress site editor, sometimes called ‘full site editing’, and the Gutenberg block editor, which has replaced the classic WYSIWYG (What You See Is What You Get) editor.
Block themes are typically smaller and use HTML files for template files. One of the most significant developments with block themes is the facility for WordPress to generate stylesheets and include code on the fly so that pages only load the code they really need.
What is a classic theme?
Now that WordPress block themes exist, the previous method of developing WordPress themes are now referred to as Classic themes. As WordPress has been available for a long time, classic themes cover a whole host of approaches. Typically, classic themes would use PHP files for template files and most of the theme would use PHP code behind the scenes to generate the pages of the website.
How to tell if you have a block theme
Test if WordPress recognises your theme as a block theme or a classic theme
WordPress will recognise your theme as either a new block theme or a classic theme. You may have a so-called ‘hybrid’ theme that incorporates functionality of both block and classic themes. However WordPress has a built in check function that it uses to adjust its functionality depending on what type of theme is in use.
The most obvious difference in the WordPress CMS is that the options in the Appearance menu will change. If you have a classic theme, you will see the ‘Customise’ option in the appearance menu, which links to the /wp-admin/customize.php page. If you have a block theme, this option is replaced with the ‘Editor’ option, which links to the /wp-admin/site-editor.php page.
Interestingly, you are blocked from going to /wp-admin/site-editor.php directly if you are using a classic theme, but you can get to /wp-admin/customize.php whether your using a block theme or a classic theme.
Checking your WordPress theme in functions.php with wp_is_block_theme();
Below is a code snippet that can be pasted into your theme’s functions.php file. It adds a custom card to your WordPress dashboard and displays the result of WordPresses wp_is_block_theme() function when checking your current active theme. I’ve found this snippet helpful from time to time when diagnosing theme issues.
// Custom theme check card for Dashboard
add_action('wp_dashboard_setup', 'custom_dashboard_widget_theme_check');
function custom_dashboard_widget_theme_check() {
global $wp_meta_boxes;
wp_add_dashboard_widget('custom_dashboard_theme_check', 'Theme type test', 'custom_dashboard_theme_check', 'high');
}
function custom_dashboard_theme_check() {
$theme = wp_get_theme();
if(wp_is_block_theme()) {
echo('<p>Your theme <em>' . $theme . '</em> is a block theme.</p>' );
} else {
echo('<p>Your theme <em>' . $theme . '</em> is a classic theme.</p>' );
}
}
Here’s an example of how this snippet should look:

Example dashboard card created by the code snippet above.
What are the required files for a WordPress block theme?
So how does WordPress know you’re using a block theme? It’s important your block theme has the correct required files, otherwise your theme may fail the check above and WordPress will treat your theme as though it were a classic theme. Even if your classic theme uses Gutenberg blocks, a theme.json file or even registers it’s own Gutenberg blocks, if it fails the check above, the theme will not be recognised as a block theme.
The minimum required files for a new block theme to be recognised as such are a style.css file and an index.html file that sits within a templates directory (or folder), i.e. templates/index.html. WordPress also recommends including an index.php at the top level of your theme directory so that it will function with WordPress versions earlier than WordPress 5.9. However as we go through more releases of WordPress, there should come a time when this file can be dropped.
Whilst not technically required, a theme.json file is also highly recommended for block themes.
What are the required files for a classic theme?
The minimum required files for a classic WordPress theme to function are a style.css file and an index.php file. In reality, your classic theme will need many more files to be a useful theme, but these are the only files that are truly required files.
Where is custom CSS stored?
One of the most popular and well-used features for a WordPress theme is the customizer. The customizer is an interface that walks you through key settings and styling options for your theme. The options available in the customizer differ from theme to theme. When using a block theme, the customizer is replaced by the new site editor.
One of the most well-used features within the customizer is the option to add custom CSS to your site. It’s proven popular as it gives web designers and developers a quick option to alter the styling of elements on a website without altering theme files that may be overridden by an update or creating a child theme, which may be excessive for adding just a few lines of CSS.
The CSS itself is stored as a post in the WordPress database, and one of the most surprising changes when using a block theme for the first time is that the custom CSS is harder to find in the site editor. There is still a dedicated section for additional CSS, but it is now hidden within an options menu. The option can be found in the three dots menu at the top right of the styles sidebar whilst editing a template
Should I be using additional custom CSS when I’m using a block theme?
As with classic themes, additional CSS or custom CSS should be used when a small change is required and you either don’t have access to theme files or don’t have a theme location that wouldn’t be overwritten by a theme update.
If you are the author of your theme, you should consider adding some CSS to your theme files or adding styling options to your theme.json file to build the style into your theme. Similarly, if you are the author or your classic theme, it’s better to add CSS to your theme files.
The reason this is recommended is that the custom CSS saved in the customizer or site editor is added to the head of your web pages inline. If there is a lot of CSS in your custom CSS field, this will add a lot of lines of code to the head of your web pages before the content is loaded.
Why is my WordPress Customizer not working?
There are many reasons why the WordPress customizer may not be working. With new block themes, the customizer has been replaced by the site editor interface and the option to view the customizer is gone.
The site editor is at a different location to the classic customizer. You can reach the site editor interface by going to [yourdomain]/wp-admin/site-editor.php. But you can still get to the classic customizer by going to [yourdomain]/wp-admin/customize.php. For the timebeing, both the site editor and the customizer are part of WordPress core. I envisage that in a few year’s time, WordPress may sunset the customizer if block themes are a success and classic themes begin to phase out.
Why it matters that WordPress recognises your theme type
Although the theme files and structures are obviously different, it’s important that block theme requirements are followed if you need Gutenberg features. For example, if WordPress does not recognise your theme as a block theme, you will not see the full site editor and miss out on several important full site editing features.
WordPress will also load styles differently if it recognises your theme as a block theme. For block themes, many styles are loaded inline and on the fly. These styles are placed in the head of the page so that they’re loaded before the content. If WordPress thinks you are using a classic theme, it will instead load these styles in the footer so as to load the content faster.
Presumably, WordPress assumes your classic theme will place styles in linked CSS files and generating more CSS for the header is superfluous. When you use the Gutenberg editor, WordPress will generate CSS based on your theme.json file. Even if you’ve written more targeted styles in a classic theme, WordPress will still generate this CSS but load it in the footer instead.
The problem arises when your pages become larger and feature several blocks and load a lot of styles. If the styles loaded on the fly by the block settings are loaded in the footer, you may start to see a layout shift as styles load in the footer after the content. Typically in a classic theme, CSS is loaded from theme-wide stylesheets in the header and not on the fly, so styles are in place before content loads.
Layout shifts are a red flag for page performance analysers like Page Speed Insights or GT Metrix, so it’s important to get this right for user experience, performance and therefore SEO.
Conclusion
A WordPress block theme benefits from the very latest cutting edge features that WordPress core has to offer. However WordPress themes may still be a so called classic theme and WordPress core still needs to support the massive number of sites that already exist. If your intention is to build a WordPress block theme, using full site editing and Gutenberg features, then its critical WordPress sees your theme as a block theme.
To add further complication, it’s possible to build a so-called hybrid theme that is perhaps a block theme that makes use of classic theme techniques. For example, I’ve worked on block themes that are still based on PHP template files and use conditional PHP techniques to dictate how pages should look. These themes are a valid approach, but you may need to check how WordPress assembles your webpages and decide whether you need WordPress to recognise your theme as block or classic.
For more posts about WordPress, the web in general, check out my blog.