How does the WordPress block editor work?

The short version

• Everything on the page is a block. Select a block to see its toolbar and options.
• Block Inserter (the plus button, top left) adds blocks. Typing / in an empty line does the same.
• Document Overview lists every block, including blocks hidden inside groups and columns.
• The Settings sidebar has two tabs: Page (or Post) for the whole page, and Block for the selected block.
• Check your work under View, then select Save. Ctrl+Z (Command+Z on a Mac) undoes your last action.

What are the parts of the editor?

These labels come from WordPress’s block editor guide, updated in September 2026. Some show as icons, so hover to see the name.

Along the top, left to right:

1. Block Inserter, the plus button. Opens a panel of blocks, patterns and media.
2. Undo and Redo.
3. Document Overview. It has two tabs: List View, a tree of every block, and Outline, which shows your headings.
4. Save draft (before a page is published) or Save (after).
5. View, for checking the page at desktop, tablet and phone sizes, or in a new tab.
6. Settings, which opens and closes the sidebar.
7. Publish, on a page that isn’t live yet.

In the middle is the canvas, where you type. On the right is the Settings sidebar, with the Page or Post tab and the Block tab.

How do I add, move and remove blocks?

1. Click where you want the new block and select the small plus, or the main inserter at top left.
2. Search for the block, such as “image” or “button”, and select it.
3. To move a block, select it and use the up and down arrows in its toolbar, or drag it in List View.
4. To remove a block, select it, open the three-dot menu in its toolbar and choose Delete.

Use List View whenever the page has columns, groups or a cover image with text on top. Clicking on the canvas often selects the outer block when you wanted the text inside it. In List View, you can select exactly the block you mean.

What’s the difference between the Page and Block tabs?

The Page tab is about the whole page: its status and visibility, the publish date, the web address (slug), the featured image, the parent page and the number of revisions. The Block tab is about the one block you’ve selected: its color, size, spacing, link settings and alt text for images.

If an option you expect is missing, check you have the right block selected. A paragraph inside a group has different settings from the group itself.

How do I check my work before it goes live?

Open View. WordPress’s preview guide describes Desktop, Tablet and Mobile sizes, a resizable canvas, and Preview in new tab, which shows the page with your theme’s header and footer.

Always check the phone view. Most layout surprises, like a button wrapping onto two lines, only show up there.

Why did “Update” become “Save”?

In WordPress 6.6, the button on a published page changed from Update to Save. Some people asked for the old label back, and the request on GitHub is still open as of October 31, 2026. The behavior didn’t change: selecting Save on a published page puts your changes live straight away. Our guide to changing a live page safely explains how to work around that.

Which keyboard shortcuts help most?

From WordPress’s shortcuts list:

Careful with Ctrl+S on a published page. It saves, and saving publishes.

What are the common mistakes and edge cases?

• Pasting from Word. It can bring hidden formatting. Paste, then check the block in List View. Our help on editing text yourself has more.
• Deleting the wrong block. Undo straight away, before you save.
• Changing a synced pattern by accident. If the block’s toolbar or List View shows it as a synced pattern, editing it changes every page that uses it. See reusable content.
• The page uses a page builder. If you see a Launch Beaver Builder button instead of normal blocks, that page is built in Beaver Builder. See editing a Beaver Builder page safely.
• Images too big. See our guide to the Media Library.

What if this didn’t work?

• If you saved a mistake, restore an earlier revision. Our help on undoing a change shows the steps.
• If the editor won’t load or shows an error, try a private browser window. If it still fails, send a screenshot to whoever maintains the site.

How long does it take to learn?

An hour on a draft page is enough to get comfortable. Create a test page, try each block, and delete the draft when you’re done.

How does E-3 handle this?

Through website care, clients can make their own edits or send them to us. We make the change for them, testing bigger ones on a staging copy first.

Related questions

• Can I change a live page without customers seeing it until I’m ready?
• How do I update the same content everywhere at once?
• How do I edit a Beaver Builder page safely?
• Should I use a page builder or the block editor?
• Back to the complete WordPress guide

Sources

1. WordPress Block Editor (WordPress.org Documentation)
2. Settings Sidebar (WordPress.org Documentation)
3. How to use the Preview function (WordPress.org Documentation)
4. Keyboard shortcuts in the block editor (WordPress.org Documentation)
5. Change Update button label to Save (WordPress Gutenberg issue 63387, GitHub)