Back to home Content and Media Learn the Interface

Learn the Interface

If you’re new to editing in WordPress, this guide will help you get familiar with what you see in the editor.


The WordPress Editor is made up of three main areas:

  1. The top menu
  2. The sidebar menu
  3. The content area
The WordPress Editor displaying the different areas, including the Top Menu, Content Area, and Sidebar Menu.
Areas of the WordPress Editor

Top Menu

At the top of your screen, you will see the following options:

Exit the Editor: Shows the W icon by default, or the Site Icon if available. Click to exit the editor.

Block Inserter: Add blocks of content to your page, like text, images, and much more.

The edit/pencil icon.

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.

Arrow icons pointing to the left and right, to represent undo and redo.

Undo and Redo: Undo an action, or redo an undone action.

Three offset stacked vertical lines, to represent the List View.

List View: See a list of all of the blocks that are on the page. Useful for navigating to different blocks.

The List View icon also opens up a second section named Outline, which shows the title, headings, number of characters, and the word count on the page.

Before you’ve published your page or post, you will see these options in the upper right corner of the editing screen:

Links with the text "Save Draft" and "Preview", with a button on the right that says Publish.

Save draft: Save a draft of your page or post without publishing it.
Preview: See how your page/post looks on your site.
Publish: Make your page/post available publicly.

After you’ve published your page or post, you will see these options in the upper right corner of the editing screen:

Links with the text "Save Draft" and "Preview", with a button on the right that says Update.

Switch to draft: Unpublish a page or post, making it a draft.
Preview: See how your page/post looks on your site.
Update: Save the changes to your page/post.

Settings: Display or hide the sidebar settings.

A green and white icon for Jetpack, where you can access more settings.

Jetpack: Access extra features available on all sites.

Three vertical dots icon, which you can click to show more options.

Options: Opens additional options.

The Settings and Jetpack icons in the top menu open different sidebar menus:


The Settings sidebar menu includes the following Page/Post settings:

When you click on a specific block in the content area, the sidebar will switch to the Block tab to show that block’s settings.

Click the Settings icon to reveal these settings

The Jetpack sidebar menu allows you to:

  • Share your post to connected social networks.
  • Get your page/post shortlink.
  • Preview how the page/post looks on social media and Google Search. (Plugin-enabled sites only.)
  • Generate a QR code for your page or post.
  • Toggle the “like” and sharing buttons for that page/post.
Click the Jetpack icon to reveal these settings
More Options

To access more options, click the three dots to the right of the Settings icon in the upper right corner. Here, you can customize your editing experience using various options.


Display or hide the top toolbar in the editor. When you enable this option, block toolbars are pinned to the top of the screen instead of appearing directly above the block.

With spotlight mode, all blocks are greyed out except for the one you’re working on so that you can focus on a single block at a time.


By default, you’ll be in the Visual editor. Switch to the Code editor to view the entire page in HTML code.


Displays Jetpack plugin by default, and any other plugins and their settings, if installed on your site.


Here, you can manage existing reusable blocks, learn keyboard shortcuts, revisit the editor welcome guide, copy all content on the page/post, or view additional help resources.


In the Preferences menu you can:

  • Further customize the editing experience.
  • Change how you interact with blocks and which blocks appear when searching for a block.
  • Show or hide individual panels from the page/post settings.
More Options

Video Tutorial

Content Area

The content area is the largest part of the editor. This is where you add blocks of content to your pages and posts. Learn more in the next guide.

Was this guide helpful for you?

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

Copied to clipboard!