What is a Block Theme in WordPress? Featured 7 Block Themes
Last updated:
What is a WordPress Block Theme, its functions, folder structure and benefits. It also explains how to find a block theme and introduces seven recommended block themes.
What is a Block Theme?
A block theme is a block-based theme that supports Full Site Editing (FSE), which will be introduced in WordPress 5.9.
What is Full Site Editing in WordPress?
You can customize everything on your site, including the header and footer, without having to edit any code.
For WordPress versions prior to 5.9, both the Block Theme and the Gutenberg plugin are required to enable full site editing.
Block Theme Features
The block theme includes the following five features
- Site Editor
- Styles
- Templates
- Template Parts
- Theme Block
When you activate the block theme, you will see the Editor (Beta) section.
You can set all the Styles (Typography, Colors, Layout) of your site.
You can edit or add new Templates for home, archive, etc.
You can edit or add new Template Parts such as headers and footers.
You can use useful Theme Blocks such as query loops and navigation.
Block Theme and Classic Theme
Themes that support full site editing are called Block Theme and traditional themes are called Classic Theme.
It can also be used as both a customizer and a site editor, or as a classic theme with theme.json support.
Block Theme Folder Structure
The folder structure of a block theme looks like this (for Twenty Twenty-Two).
- theme.json is included
- Templates and template parts are HTML files
It has the above characteristics.
twentytwentytwo/
├ style.css
├ theme.json
├ index.php
├ functions.php
├ templates/
│ ├ index.html
│ ├ single.html
│ ├ archive.html
│ └ ...
│
└ parts/
├ header.html
├ footer.html
└ ...
Benefits of the Block Theme
The block theme offers the following benefits in terms of page loading speed (performance)
Using theme.json reduces the amount of CSS (Cascading Style Sheets) code used by the theme.
Multiple style sheets can be registered for each block, so you can load the necessary CSS according to the blocks contained in the page.
How to find a Block Theme
Block themes are registered in the official WordPress theme directory. You can narrow down the block themes by applying a filter in the “Full Site Editing”.
Currently, there are 39 block themes registered.
Featured 7 Block Themes
Twenty Twenty-Two
Twenty Twenty-Two is the default theme introduced in WordPress 5.9. It is the first block theme as a default theme.
Below are the block themes with the highest number of active installs in the official WordPress theme directory.
Aino
- Author: Elma Studio
- Active Installations: 700+
- WordPress Version: 5.8 or higher
- PHP Version: 7.0 or higher
Zoologist
- Author: Automattic
- Active Installations: 800+
- WordPress Version: 5.8 or higher
- PHP Version: 5.7 or higher
This is a child theme of Blockbase.
Tove
- Author: Anders Norén
- Active Installations: 400+
- PHP Version: 5.6 or higher
Blockbase
- Author: Automattic
- Active Installations: 400+
- WordPress Version: 5.7 or higher
- PHP Version: 5.7 or higher
emulsion
- Author: nobita
- Active Installations: 300+
- PHP Version: 5.6 or higher
Quadrat
- Author: Automattic
- Active Installations: 300+
- WordPress Version: 5.7 or higher
- PHP Version: 5.7 or higher
This is a child theme of Blockbase.