Back to Support Design Your Site Site Editor Use the Site Editor

Use the Site Editor

Using the Site Editor, you can design everything on your site — from the header right down to the footer — using blocks. This guide will show you around the editor.

Access the Site Editor

To visit the Site Editor, follow these steps:

  1. Start from your site’s dashboard.
  2. Locate Appearance on the left side.
  3. Click on Editor.

If you do not see Editor here, your theme does not support the Site Editor. We recommend switching to a supported theme to make use of the latest editing features in WordPress.

Screenshot showing how to open the site editor from the the Appearance → Editor menu.
Access the Site Editor under Appearance in your dashboard

When you arrive in the Site Editor, you will see:

Animated GIF showing the action of clicking on the right side to open the editor, closing the left side panel.

The left sidebar provides the following options:

  • Navigation: Manage your site’s navigation menus.
  • Styles: Customize colors, fonts, and other design aspects of your site.
  • Pages: Edit the content of individual pages of your site.
  • Templates: Edit the structural layout of your site’s content.
  • Patterns: Edit smaller parts of your templates (such as the header and footer) and patterns you’ve created.

Your homepage will be displayed to the right of these options. Click anywhere in this area to close the left sidebar and open your homepage in the editor.

Site editor design page with the options Navigation, Styles, Pages, Templates, and Patterns.

Top Menu

Once you’re in the editor, a top menu will appear with several options, each explained below:

The top bar of the site editor is shown, with each option numbered according to the explanation below.
  1. Your site’s icon: Click this once to return to the options described in the previous section. Click twice to return to your dashboard.
  2. The + block inserter button: Click this to add a new block.
  3. Tools: Choose between editing a block and selecting a block. Choose the Select tool to select individual blocks. Once a block is selected, press the Enter key on your keyboard to return to editing.
  4. Undo: Reverse the most recent action taken.
  5. Redo: Un-reverse an action you reversed using the Undo button.
  6. List View: See a list of all of the blocks that are on the page. This is useful for seeing your page’s structure and editing, moving, and removing blocks. Learn more about List View.
  7. Command Center: This shows the name of the template you are editing. Click this to search through your site’s templates. Learn more about template editing.
  8. View: See a preview of your site’s appearance with the changes applied.
  9. Save: Save your changes. Learn more about saving.
  10. Help Center: Search our helpful guides or contact support on eligible plans.
  11. Settings: Display or hide the settings sidebar on the right.
  12. Styles: Customize the colors, fonts, and more. Learn more about Styles.
  13. More Options: Opens additional settings and tools.

Save Changes

When you click the Save button to save changes you’ve made in the Site Editor, it will note the places you’ve made changes to. You can choose to save all or just some of them. Note that some changes (like changes to the Header and Footer templates) will apply to all pages of your site that use those templates and not just the page you were working on.

Slow down or speed up the video using the controls in the lower right corner after clicking Play


Use Styles in the Site Editor to choose color palettes, fonts, layouts, and more design aspects that affect your site as a whole. Learn how to use Styles.

An arrow is pointing to the Styles button.
The Styles button

Additional Guides

Here are more helpful resources and tutorials to learn more about all aspects of site editing:

Was this guide helpful for you?

Not quite what you're looking for? Get Help!

Copied to clipboard!