The New WordPress Full Site Editing Explained

Illustration of a woman using full site editing in WordPress

Did you know that WordPress is an open-source platform? This means that they share their coding and backend to provide freedom of use for everyone who wishes to use it, change it, and develop it for a customized experience.

While WordPress is generally easy to use, there is still a bit of a learning curve. So, whether you are a beginner or a veteran, this article will answer the question, “What is WordPress Full Site Editing?”

Want to become a pro in WordPress editing? Keep reading! 

What Is WordPress Full Site Editing?

In 2021, WordPress released a new way to update the appearance of your site. Then, at the beginning of 2022, they added new features to streamline the process. 

Full Site Editing (FSE) contains beneficial features that allow you to edit the entire site using blocks. 

If you are familiar with Block Editor, you will have a basic understanding of how it works. Instead of just using blocks in your posts, WordPress added that you could use them for your entire site.

The updates included:

  • Site Editor
  • Template editing
  • Theme blocks
  • Styles

WordPress uses the Gutenberg plugin, also called the Block Editor. It was introduced in WordPress 5.0 and has mixed reviews. The new updates (5.8 and 5.9) have a similar interface regarding the FSE. 

The new update also increases the performance of your website as well. This means that the speed, the user experience, and the SEO ranking will be much better throughout the entire website. 

Know the Lingo

Knowing the terminology that WordPress uses for its editing tools can go a long way in understanding the site. Let’s look at some of the essential items you should know.

Blocks

Blocks allow users to create content without embeds, shortcodes, and external media. Instead, you will have the option to create content with either static or dynamic blocks.

An example of a static block is a written paragraph. When it is uploaded, the content stays the same. However, a dynamic block will change throughout time, depending on the content.

For example, if you have a block that features the latest posts, the dynamic block will update with each new post. Other examples include comments and reviews. 

These blocks will allow you to format your post and customize it without any knowledge of coding. 

Within a block, you can create:

  • Headings
  • Quotes
  • Galleries
  • Page breaks
  • And more

The options are endless and more content is available when you install specific plugins. 

Block Patterns

Block patterns allow you to group blocks and use them as templates for other posts. They stick to a specific layout that you can use for different content in multiple places.

It eliminates the need to start from scratch with every post, giving you a basic layout that you can still customize if necessary. 

Reusable Blocks

A reusable block is beneficial if you run specific content in several places on your site. For example, if you are running a promotion, you can create a reusable block instead of creating each block separately to save a significant amount of time.

Templates

Templates are similar to block patterns. However, they are useful on a larger scale. For example, block patterns are great for specific sections of your page, whereas templates will create a layout for the entire page or post.

Template Parts

Template parts are significant for sections of your site that will remain constant throughout the entire design. 

Headers and footers are great examples of when using templates part will prove beneficial. Before the new updates of FSE, headers and footer required coding to edit.

Block-based Themes

Themes are pre-coded styles by third-party companies that allow you to easily design your website. However, not every theme is compatible with Gutenberg.

Especially now, with the new updates, you will need to make sure that your chosen theme is easily customized with blocks. 

How to Use Full Site Editing in WordPress

The first step to accessing the FSE is activating a theme compatible with the new update. This needs to be a theme that supports the latest Gutenberg version and the 5.9 WordPress version. 

Once you activate your chosen theme, you can click “Appearance -> Editor” in the side menu of WP-Admin. This will load the Site Editor, and you can start customizing your page. 

Site Editor

Currently, Site Editor is in beta. This means it is still in the developing stages and will improve with time. 

The Site Editor allows you to design everything on your website. As mentioned before, instead of knowing how to code, you can now use blocks to customize your headers and footers. If you feel like you could improve the look of your site, you can now do so with blocks!

You will see the following elements in the Site Editor:

  • Site icon
    • Access to dashboard
      • Also called Navigator
  • Block inserter
    • Adds blocks
  • Tools
    • Choose between selecting or editing blocks
  • Undo and Redo
    • Reverses and un-reverses the latest actions
  • List View
    • See all blocks in a list
      • Headers
      • Footers
      • Menus
  • Preview and Save
    • Preview your edits without launching
  • Styles
    • Customize the appearance of a block

We will discuss Styles in-depth below. 

You will want to use the Site Editor when you are planning to change your headers, footers, and the overall appearance of your site. If you want to change your site’s content, you can edit it by clicking “Posts” and “Pages” in the WP-Admin. 

Using Site Editor

If you’ve already created a few pages, like the About Page, Home Page, or a Blog Post, they will automatically show in your Site Menu. 

When using the Site Editor, you can add several different items to your Headers. 

Including:

  • Site logo
  • Menu
  • Search bar
  • Social Icons

You will need to select the block you want to edit, or you can select the Navigation Block under List View. Once you select the header, you can start to edit it.

Simply click on the “Add New” button, and you can add new or existing pages. You can also switch the order in which your pages appear on your menu.

Additionally, you can customize it by adding your logo and social icons, like Facebook or Instagram.

If you wish to change the color of your header, footer, or menu, you can select the Styles button on the top right corner. 

Template Editing

You can edit the templates of your chosen theme as well. Often, themes and templates are used interchangeably. However, there is a significant difference between the two.

Templates will change the look and structure of a page, while the theme changes the entire site. If your theme has templates, you can edit them now with blocks as well.

You can access the Template Editor via Page/Post Editor or the new Site Editor. In both instances, you can select “Templates” and start editing.

Next, simply click on the template you wish to edit and get started!

You can edit:

  • Elements of the header
  • Add a menu
  • Add a sidebar
  • Edit appearances
  • Hide items

Styles

While a theme determines your site’s appearance, you can still make significant changes using Styles. Styles will allow you to change colors, layout, font, and more. 

To access Styles, go to your Site Editor by clicking “Appearance->Editor” and then click on the “Styles” button in the top right corner. 

When you change the font, you can also choose the size, line height, weight, and inclination of the text.

To change the colors, click on “Palette.” This will change the colors of your overall site. There are three categories:

  • Theme
  • Default
  • Custom

You can edit each of these by clicking on the three vertical dots. 

Furthermore, you can also change the layout of your page and the blocks. For example, you can change the font, border, and buttons of blocks on a global scale or change them separately for each block. 

Changing Specific Blocks

There is a large number of available blocks:

  • Login
  • Navigation
  • Page list
  • Query loop
  • Site logo
  • Site tagline
  • Site title

We’ve discussed how to change the Navigation block, where you can change the way your header looks. Similarly, you can change the other blocks around to fit your needs. 

For example, click the Block Inserter button for the Login/Out Block. You can search for “login” and click to add it to your page.

To edit and change the settings, you can navigate to the right sidebar. In there, you will see all the settings available to the respective block. 

If you do not see the right sidebar, you will need to click the “Settings” (gear) button in the top right corner.  

How to Edit a WordPress Site: Get Started

So what is WordPress Full Site Editing? It is the perfect way to streamline the backend of your website operations. With a compatible theme, you can make your website into a stunning digital platform that your audience will love. 

Not only that, but it also improves the performance of your site, allowing you to rank higher in search engines and retain your customers!

Are you looking for a compatible theme? Check out our Hastighet theme!

Related posts

Latest posts