Have you toured the new WordPress Site Editor yet? Full Site Editing is sure to change how websites are created by reducing the need for code and improving the speed to customizing layouts.
It was first available in February 2020 within the WordPress 5.6 release and further integration will be available with the 5.9 release later this year. Rest assured, if you don't change your current theme, new features will not impact you.
What is Full Site Editing?
Full Site Editing also known as FSE, is a new way to use blocks throughout your WordPress website. You can now use blocks everywhere on your site, not just in posts or pages. This is a significant shift in how we can build websites with WordPress.
The vision of Full Site Editing is to provide a collection of features that bring the familiar experience and extendability of blocks to all parts of your site rather than just post and pages.
In 2017 the Gutenberg plugin rolled out and later merged into the core software. This brought block editing to the WordPress posts and pages interface. By installing the Gutenberg plugin, users are able to test the latest features before they are merged into the core software.
We've begun to share tutorials of these new features:
Even more features are already available for testing and will continue making their way into WordPress core.
What is the Site Editor?
To see the Site Editor and other block features, we're using the Blockbase theme in this tutorial, along with the Gutenberg plugin. When WordPress 5.9 is released, if you use any block theme, you won't need to install the Gutenberg plugin to access the Site Editor settings.
The Site Editor allows you to edit and navigate between various templates, template parts, styling options, and more.
When you load the Site Editor interface, you'll find the template hierarchy of WordPress. This includes layouts for the front page, single post, page, and 404 pages. Depending on which theme you select will determine how much of these layouts are completed for you, or if you are customizing them from the start.
Within each layout, you can use the Block Editor to add blocks to your layouts.
What are Block themes?
Block themes are those that are ready for Full Site Editing. Themes that are equipped to connect to the Site Editor and allow website builders to assemble everything using blocks.
You can find a list of freely available block themes in the WordPress Themes directory.
What are Templates and Template Parts?
Each area within the Site Editor left navigation (accessible when selecting the WordPress logo or site favicon in the upper left) is a template. In this area, you can create layouts for each of these regions. Generally, these would be the layout for a single post or page area.
But what if you wanted to create a template for a smaller portion? Template parts are ideal for this. You could use a template part to create the footer for your entire site in one location.
Initially, when you enter the Site Editor interface, you'll see the view shown earlier. But if you'd like to use the Site Editor to access template parts, select the top link "Back." This will show you the templates and template parts regions.
See our guide on creating templates: Block Based Template Editor
What are Global Styles?
Configuring themes to use the color and fonts, and any other branding is important. How can you change the settings and options for the theme?
In the upper right, the circle half-filled in will display the Styles area. Here, you can select styles for the entire site, or narrow in to specific block styles. To some extent, this area will replace the Customizer method of changing settings.
Have no fear, the Customizer will not be removed. However, in Block Themes, it won't display in the Admin Dashboard.
Colors, fonts, and other choices here are determined by the theme developer. To create these settings, check out the WordPress Developer Handbook for Theme.json settings.
What changes with the Navigation Block?
After you've created the Navigation Menu that you'd like to use in the header of your site, you'll need to assign it to the location to display.
Within the Site Editor Template Parts, you can navigate to the Headers section. From here, you can add the navigation block as needed and select the corresponding navigation menu.
What Full Site Editing means for developers and website builders
Full Site Editing is sure to change how we create themes in WordPress. Theme developers will still need to code, but those wanting to change what displays in the footer of the site no longer need to approach this first from a code solution.
Every part of the website is now able to be edited and controlled using blocks. This is sure to be a faster workflow when tweaking existing layouts and will make site configuration so much faster.
Global Styles will be a more consolidated code method to control the colors and options available to users on the sites you build.
Where can I learn more?
We look forward to the WordPress 5.9 release on December 14. If you'd like to keep testing the new features coming, watch the WordPress FSE Outreach program for calls for testing. These calls for testing are around the latest features of WordPress and provide a set of directions to practice using every aspect of the features.
