Skip to content
English
More support View Your Support Tickets
Contact us
  • There are no suggestions because the search field is empty.

What is a block-based WordPress theme?

A block‑based WordPress theme (also known as a "block theme") is a modern theme structure that leverages Gutenberg blocks and Full‑Site Editing (FSE) to enable visual and flexible site design—across headers, footers, content, navigation, and templates—without relying on PHP templates or a theme customizer.

Origins and Overview

Introduced with WordPress 5.9, block themes ushered in full-site editing, making block-based layout design a core part of WordPress architecture. The first default block theme was Twenty Twenty-Two, launching with FSE capabilities. 

Key Features

Full-Site Editing via Site Editor

Block themes integrate with the Site Editor, replacing the old Customizer. From there, you can customize everything—templates, template parts, styles—live, visually. 

HTML Template Files

Instead of PHP templates (header.php, index.php), block themes use HTML files in a templates directory. This simplifies theming and aligns with JavaScript and block workflows. 

theme.json for Styling

All global and block-level styling—typography, color palettes, spacing—is centralized in a theme.json file. This enables consistent, efficient use of styles across blocks. 

Reusable Patterns & Template Parts

Block themes support block patterns (pre-built layouts) and template parts (like header.html or footer.html), allowing designers to compose and reuse layout sections easily. 

Block Themes vs. Classic Themes

Feature Classic Themes Block-Based Themes
Templating PHP files HTML files & blocks
Editing Tool Customizer Site Editor (FSE)
Styling style.css + CSS overrides theme.json + block styles
PHP Usage Heavy reliance Minimal, optional
Flexibility Limited without coding Full visual control

Benefits

  • Code-free whole site design—design using blocks, templates, and patterns. 

  • Streamlined performance—blocks load only what’s needed, improving page speed. 

  • Future-ready—aligned with WordPress’s direction and block editor roadmap. 

  • Less dependency on plugins—eliminate many page builder plugins and custom PHP. 

Challenges & Considerations

  • Learning Curve—transitioning from classic theme development requires learning new tools and file structures. 

  • Documentation—block themes are newer and less documented; developers need to rely on evolving documentation. 

  • Legacy Plugin & Theme Compatibility—some older features or plugins may not fully support FSE. 

How to Get Started with a Block Theme

  1. Select a block-capable theme (look for Full-Site Editing or block theme tags on WordPress.org). 

  2. Explore the Site Editor under Appearance with the theme active.

  3. Edit styles and templates using the built-in style panel and template layout options.

  4. Explore pattern usage—inserting, customizing, and saving your own block combinations. 

  5. For developers—examine block theme folders: /templates/, /parts/, /patterns/, /styles/, and configure them via theme.json.

 

Block-based WordPress themes are a transformative evolution in site design—putting full visual control into the hands of users and aligning WordPress with modern, modular, UI-driven workflows. With HTML templates, theme.json styling, and Full-Site Editing, block themes deliver flexibility, performance, and future-proofing—making website design more intuitive, powerful, and plug-and-play than ever before.