WordPress Gutenberg Theme: Structure, Hierarchy and Custom Templates

There are now technically two ways to build themes. One is the old standard way, where you have PHP templates (which follow the traditional template hierarchy). The other is based on blocks themes what blocks are used for everything.

My recommendation is to stick with traditional for now. Full Site Editing, which is part of the block-based theme work, is still in its infancy and you can still use the Gutenberg editor with the old template method. I only do this in my work.

What I usually do is one blocks folder in my theme which in turn is my package.json file. This is where I post all my Gutenberg-specific theme stuff. So I have a subfolder (in blocks/src/) for blocks, plugins, block-stylesetc. I will then add all the necessary JS to create all those blocks and plugins. I then use the standard for templates .php template files (e.g archive-post_type.php, single.phpetc.).

When you register a custom message type, you can specify a default ‘template’ of blocks:

register_post_type('post_type_slug', array(
    // ...
    'show_in_rest' => true, // Make sure to include this so it loads the Gutenberg editor
    'template' => array(
        array('core/heading', array(
            'level' => 2)
        ),
        array('core/paragraph'),
    ),
));

You can also lock the templates if you want. To see template_lock for your options.

I’ve written some other answers on SO for things like how to get and set up custom post meta with Gutenbergand general best practices I use when working with custom post types in Gutenberg. I suggest checking that out too.