Last updated:
The Site Editor is a part of the Full Site Editing (FSE) capabilities that have been progressively integrated into WordPress since the release of WordPress 5.9 in January 2022, and has been evolving ever since. While there are several minor updates completed throughout a year, WordPress typically releases two or three main version updates per year. WordPress 6.4 was released on November 7, 2023. All WordPress.com sites use the most recent version.
The Site Editor expands the block editing experience, which was initially limited to post and page content, to the entire site. This means you can use blocks to design and customize headers, footers, sidebars, and other areas of your site. It provides a no-code, visual way of building and customizing your website from top to bottom. It allows you to edit templates and template parts, styles, and site-wide defaults, offering a more holistic approach to site design compared to the traditional WordPress Customizer.
Whether you’re building a blog, a business site, or a personal portfolio, the Site Editor offers a user-friendly way to bring your vision to life without needing deep technical knowledge or coding skills.
However, as with any new technology, there’s a learning curve involved. In this lesson, we offer an introduction to navigating the Site Editor and the features it offers.
To get started, hover over Appearance in the left sidebar of your main dashboard↗︎ and click on the link for Editor.
Note:
If your site doesn’t include a link for Editor under Appearance, your site is using a Classic theme. You’ll need to activate a Block theme↗︎ in order to access the Site Editor. Before switching themes on an existing site, please review our Switching Themes lesson. Alternatively, create a new, free site to explore Block themes and the Site Editor.
Appearance is a parent item in the left sidebar menu of your main dashboard. Hover over it to see the submenu items. This is where the link to the Editor will be located when a Block theme is active.
When you first enter the Site Editor, you’ll see a navigation Design panel on the left and a preview of your complete Homepage, including the content. Clicking anywhere on the preview portion of the screen will open the Site Editor, which is an editor screen that looks similar to the editor used when creating pages.
In the top left corner of the editor you’ll find: the + icon which opens the Block Inserter, this is where you’ll also find Patterns. Your Undo and Redo action icons. And the 3 horizontal lines will open the List View.
This title bar is one of the indicators that you are in the Site Editor. When the name here is purple, you’re editing a template.
In the top right corner of the editor, you’ll find icons for:
- Preview options
- Save
- The Help Center
- Settings sidebar
- Styles sidebar
- More options
Hover over any icon to see a text label indicating what the icon is for.
At the top of the Settings sidebar there are tabs telling you what you’re currently working on. When this says “Template” it means you’re editing a template, not a “page”.
The breadcrumb in the bottom left corner also tells you what you’re editing.
Depending on your theme and setup, this homepage will either be a dedicated template, called the Default Homepage, or it will be a page combined with a template, called a Custom Homepage. Our Homepage and Posts Page lesson further explains these different configurations.
The name and label in the center at the top of your screen is your first clue to whether you’re editing a template or a page. A gray “page” name means this content is built in a page and paired with a template. A purple “template” name means this content is built directly in the template.
If you click the Settings icon in the top right corner of the editor, you’ll open the Settings sidebar on the right, and here you’ll also see either Template or Page as the label at the top of this sidebar. These are your primary tell-tale signs that you are in the Site Editor and whether you are editing a template or your “content”.
As you further explore the Site Editor and Templates, you’ll learn that there are multi-use templates as well as single-use templates, which are managed differently. We recommend reviewing the Templates Explained lesson to gain a better understanding of when content will be included in a template and when it won’t.
For beginners, we recommend using the Site Editor to focus on editing your multi-use and single-use templates and manage your regular page and post content from their respective sections from the main dashboard↗︎. As a rule of thumb, other than for a Default Homepage, avoid editing any page specific content within the Site Editor (for now).
Confirm that you’re seeing the purple template name at the top of the Site Editor screen. If the name at the top of the screen is gray and you see Page at the top of the Settings sidebar, click on the template name in the Settings sidebar to Edit the template.
Next, click the List View icon in the top left corner. Here, you can explore what blocks this particular template already has in place. Clicking the arrow next to any block will expand it to reveal more blocks. You’ll notice that some blocks may have a lock next to them, this is to act as a warning that these blocks are important for this particular template, and you should be careful about deleting them. Further details are covered in the Templates Explained lesson. For now, let’s explore.
If you click the Site Icon image in the top left corner, you’ll close the editing mode and return to the preview mode with the Design panel on the left. (Clicking the Site Icon again will take you back to your main dashboard and out of the Site Editor.) From this Design panel you can explore the different options currently available within the Site Editor.
As the Site Editor feature is evolving, you may sometimes find that it has changed. Always be willing to read and explore the items in this panel, and don’t be thrown off if they happen to change order, or the available items change.
This section is the primary function of the Site Editor. When you click this section you’ll see a list of active templates that are in use within your site. There’s also an option to manage all templates, and to create new templates. Clicking on a template name will display a description and preview of the template, and access to edit the template.
This is the next most important section of the Site Editor and includes the full library of pre-designed patterns that come with WordPress.com and your specific theme. It’s also where you’ll find dedicated Header and Footer template parts, and any custom patterns that you create.
This section provides quick access to the color palettes, if available, for your particular theme. You can click on the palettes in the left panel to apply it to your entire site. These palettes are a premium feature that is included with the Explorer plan and higher.
The “eye” icon will open the Style Book where you can scroll to see the various styles applied across your site. The “pencil” icon will take you into the editor and open the Styles panel on the right.
Some themes may not offer a selection of predefined color palettes, in which case this option in the main Design panel will take you into the editor and open the Styles panel on the right.
In this section you can access your site pages, and you can even edit them directly in the Site Editor. The Manage All Page link at the bottom will take you back to the main Pages section accessed from the main dashboard. There is nothing wrong with editing page content from this section, just remember that these are pages and you’re editing content. Edits you make here are the same as editing the content from the Pages section of your main dashboard. The page settings available within the Site Editor are also limited to what you’ll find from the main Page section.
As mentioned, for beginners, we recommend managing pages from the main Pages section from the main dashboard↗︎ and just use the Site Editor for editing templates, until you’re clear and confident with the different sections.
When you’re editing templates, you’ll find a level of convenience at being able to access specific pages within the Site Editor for quick edits, but it’s also a feature that can cause some confusion. So be intentional about where you are and what you’re editing.
This is an evolving feature that currently allows you to perform some basic edits such as reordering and removing menu items from the available menus in your site. More advanced menu management happens directly in the Site Editor wherever you have placed the Navigation block. For further information on managing menus for Block themes in the Site Editor see our lesson on Working With Menus.
It’s worth spending some time investigating these items and reading the explanations provided for each.
Remember, the Site Editor is a dynamic and evolving feature, so staying curious and open to learning is key to making the most of it.
As you continue to explore and experiment with the Site Editor, feel confident in your ability to bring your unique vision to life on your website. Whether you’re adjusting templates, experimenting with patterns, or refining page layouts, each step you take is an opportunity to enhance your site’s functionality and aesthetics.
We encourage you to revisit lessons, explore new updates as they come, and practice regularly. The more you use the Site Editor, the more intuitive it will become. And don’t forget, our comprehensive lessons and resources are always here to support you.
Back to top