Full Site Editing

Full site editing and the Site Editor has been available since WordPress version 5.9. It was released over 3 years ago, in January 2022.

The purpose of full site editing is to give site owners and other users more ways to change the design and layout of the website.

Site wide styling options, where you set the color palettes, widths, font family and more.
Editing and creating templates like the home page, 404, search, archive and custom page templates.
Editing and creating parts like the site header and site footer.

Another important feature are block patterns. These are re-usable designs made from groups of blocks. Patterns are also available on sites that do not support all full site editing features.

You need to install a block theme, also called a full site editing theme.

Please visit this page where I have a list of themes that you can use.

As Gutenberg is updated every two weeks, I recommend that you use the latest release.

Block themes uses blocks instead of widgets. Widget areas (sometimes called sidebars) are no longer needed because you can place blocks anywhere. You are no longer restricted to placing content in areas that the theme developer has decided.

Custom templates are available for block themes and for classic themes that has support for the new template editing feature that was added in WordPress 5.8.

There are two ways to create new templates.
You can go to Appearance > Editor > Templates and select “Add New”.
First you will be asked to choose the template type, and then you can start editing.

If you want to create a new template for a single page, you can do it from the block editor.
Create a new post or page in the block editor.
Locate the Template section of the post settings sidebar.
Click on the name of the current template. In the popover, select “Add New”.
You will be asked to select a name for the template, and then you can start editing your template. When you have finished editing you can use the back button in the top toolbar of the editor to go back to your page.

Assemble your blocks in the Site Editor. Then copy the code for the blocks.
Create a new HTML file in the templates folder of the theme. Then paste the code into the file. You do not need to add any other kind of file header to the HTML file.

In the theme.json file, at the root level, add a new section called customTemplates
and enter the file name and a title.
The first value is the file name (slug) that you selected for the template,
and the title is the visible name in the editor.

      “customTemplates”: [
        {
            “name”: “about”,
            “title”: “about”
        }
    ]

You can find more information in the official documentation.

Instead of PHP if… else statements, you can use block settings and CSS.

The theme can still have different body classes depending on which page you are viewing, so you can use CSS to show or hide elements.

If the block settings are not enough to achieve what you need, you can extend existing blocks by adding new settings. Block attributes can be filtered and you can read more about this in the block editor handbook.
But consider if this is something that should be in a theme or a plugin. This depends on what or who you are using the theme for.

If you have a really good example of when you would need to use a conditional, and you can’t achieve the same results using the available options, I encourage you to bring it up for discussion on the Gutenberg GitHub repository.

Also see the article How to use PHP templates in a block themes.

If you need to use custom action hooks- I will assume that this is what most people are wondering about; you will need a custom block. 

I don’t have enough experience with creating custom blocks to be able to guide you, but you would likely be using the wp.hooks package with addAction and doAction.

Reference:  https://developer.wordpress.org/block-editor/packages/packages-hooks/

Some actions and filters will work the same way for both classic and FSE themes, but not all, and there are bugs.

You will be able to use actions like wp_body_open and wp_footer like before.

Many blocks use PHP for the front, and for some blocks, the PHP filter only affects the front. One known bug is that if you want to change the default excerpt length, you need to use both the PHP excerpt_length filter and update the WordCount block attribute.

I encourage you to help test existing filters so that bugs like these can be found and solved.

I have not done any testing with menu walkers but I expect some individual filters to work. I suggest reading through the source code for the navigation block first.

You will be able to add blocks as menu items to the navigation block, and this may reduce the need for menu walkers.

It is currently (2021) possible to use custom comment walkers, but this seems to be a bug more than anything. If you add a comments.php file to your theme, it will actually be used to render the comments.

The good news is that you won’t need to use comment walkers because you will be able to use individual blocks to arrange your comments and the comments form.

No, this is not a JavaScript-heavy course.

No, but there are lessons about custom block styles, variations, and block patterns.