Getting Ready for WordPress Full Site Editor
Back in 2018, WordPress introduced the Gutenberg Editor, allowing users to add blocks to individual pages and posts. This gave us the ability to edit pages without the need for custom coding skills. It took some time to get used to, but now we’re all using blocks like a pro, right?
Now, WordPress will be slowly rolling out Full Site Editor (FSE), which gives its users even more design flexibility with the ability to use blocks everywhere on their sites, rather than just with pages and posts. This includes the header and footer areas, featured images, and navigation.
Let’s dig into the features of the WordPress Full Site Editor so that we’re all up to speed.
Block-based themes
The beauty of full-site editing is that it allows you to edit your whole page or website using blocks, rather than just portions of a page or post. The themes themselves will contain all block-based elements. This can improve your overall workflow, eliminating the need to toggle between the WordPress Customizer and the WordPress editor. It keeps everything organized in one place.
The big takeaway here is that everything is a block. Full site editor-enabled themes will contain templates and template parts that are blocks: All of the elements that weren’t previously editable as blocks, will become blocks. Ultimately, it will make creating and editing your site more seamless within the block system.
Template editing
With template editing, you can create reusable templates that can be used on every page and post, including elements that previously did not have block capabilities, like site titles and page titles. This will also be the place to edit colors and individual designs, which currently lives in the WordPress Customizer.
There will be a new template section where you can select your template, edit existing templates, or create new ones.
New block types
There will be plenty of new types of blocks to accommodate all aspects of your site. You can add these blocks anywhere on your site, including header and footer areas. New blocks include site title, logo, navigation, post author, post title, featured image, and date.
One new block worth noting is the Query Block. Without any coding knowledge, site creators can use this block to filter content from posts, pages, categories, custom post types or custom taxonomies. Instead of using code, you can use dropdown boxes and toggle switches to create these queries.
What does this mean for developers?
As you can see, Full Site Editor is designed to help site owners create a website without any coding or PHP knowledge. For theme developers, however, there will be a new configuration file to create both classic themes and block themes. This will be the place to do all theme editing. It has the added benefit of reducing the amount of custom CSS required when creating a new theme.
Testing it out
Before Full Site Editor officially goes live, it’s important to test things out for yourself so there’s no surprises when it launches.
To get you started, you’ll first want to do all of your testing on a staging site. This way, you don’t accidentally break your live site with any changes caused by Full Site Editor.
Next, install the Gutenberg plugin by navigating to Plugins > Add plugin and searching by name. Once you activate the plugin, you will see a Gutenberg menu item added to the WordPress Dashboard.
Only certain themes currently work with Full Site Editor, so you’ll want to also install the Twenty Twenty One blocks theme. Navigate to Appearance > Themes > Add New and search for “TT1”.
Once that theme is activated, you will now see the Site Editor menu item added to the WordPress Dashboard. Click on it and you’ll be taken to a WordPress page template where you can begin using Full Site Editor.
Pro tip: If there’s an issue when testing out Full Site Editor on your site, we recommend testing for conflicts to determine if there is a plugin conflict or a legit bug.
Using The Events Calendar with Full Site Editor
Since the Full Site Editor is so new (and in fact, still in the beta phase) many plugins do not fully support it, including The Events Calendar. At this time, our plugins should only be used with an FSE theme for the purposes of discovery and testing, and that should only be done on a local or staging site. Happy experimenting!