Gutenberg Blocks in WordPress: Patterns and Templates

Gutenberg is the WordPress block editor, where a page is assembled from separate blocks: paragraphs, images, columns, buttons. Since version 5.9 it has included full site editing (FSE), so blocks now control not only content but also the header, footer and page templates. Below is how to speed up editors with patterns and how to safely set up your own templates.

How a block pattern differs from a regular block

A block is a single element: a paragraph, an image, a button. A pattern is a pre-assembled group of blocks with ready layout, for example a "three columns with icons" block or a "review form". An editor inserts a pattern with one click and then only changes text and images, without rebuilding the structure.

Patterns are either stored in the theme (a PHP file) or created directly in the editor and saved to the database as a separate post type, wp_block. The second way is simpler for a content manager, the first is more reliable when moving sites and updating themes.

How to register your own pattern in a theme

A theme pattern is a plain PHP file with block markup in comments. It lives in the patterns/ folder inside the theme and loads automatically if theme.json declares support.

<?php
/**
 * Title: Three features with icons
 * Slug: mytheme/features-three
 * Categories: featured
 */
?>
<!-- wp:columns -->
<div>
  <!-- wp:column -->
  <div>
    <!-- wp:heading {"level":3} -->
    <h3>Quick start</h3>
    <!-- /wp:heading -->
  </div>
  <!-- /wp:column -->
</div>
<!-- /wp:columns -->

Once the file is saved, the pattern appears in the editor's "Patterns" tab without installing any plugin. Such a file is easy to keep in git and move between environments together with a child theme.

How to build your own page template with FSE

Full site editing works only with block themes (ones that ship a theme.json). A custom template is created under "Appearance → Editor → Templates → Add New". It is also saved as a file in the theme's templates/ folder if you export changes via "Tools → Export".

A common task is a separate template for landing pages without a header and footer. Create a page-landing.html template, remove the header and footer blocks from it, then on the page you need, pick that template in the "Page template" panel in the sidebar.

How to limit the block set for editors

If the team has several authors with no layout experience, extra blocks (HTML, Query Loop, custom CSS) only get in the way. Limit the list with a filter in the child theme's functions.php.

<?php
add_filter('allowed_block_types_all', function ($allowed, $context) {
    return array(
        'core/paragraph',
        'core/heading',
        'core/image',
        'core/list',
        'core/quote',
        'core/button',
    );
}, 10, 2);

Changes in functions.php take effect immediately, with no plugin activation, but make them only in a child theme — updating the parent theme will overwrite the file.

Patterns, templates and blocks: what to pick

Common mistakes when working with blocks

A white screen after adding a pattern almost always means a syntax error in the pattern's PHP file — a missing bracket or an unclosed block comment. The diagnostic order is the same as for any WordPress fatal error: turn on WP_DEBUG, check wp-content/debug.log, and if needed read the detailed breakdown in the article about the white screen and error 500.

A second common problem is a conflict between page-builder plugin patterns and theme patterns: both can share the same Slug. Rename the theme pattern's slug by adding a project-name prefix.

Summary

• Patterns speed up typing standard content and need no plugins if the theme supports them.
• Custom page templates are only available in block themes with FSE and are stored as HTML files in the theme.
• The block list for authors is worth narrowing with the allowed_block_types_all filter in a child theme.
• Gutenberg data can also be read through the WordPress REST API — useful when part of the content is rendered on an external front end.
• Always do customization in a child theme, otherwise a parent theme update will erase the changes.