Nayan Dhumal
The WordPress block editor, also called Gutenberg, is the editor you use to write posts and pages in WordPress. Every piece of content is a block: a paragraph, a heading, an image, a list or a table. It became the default editor in WordPress 5.0 in December 2018. This guide covers the parts of the screen, how to add and move blocks, and the shortcuts that make writing faster.
If you started blogging recently, the block editor is probably the only WordPress editor you have seen. If you remember the older classic editor, blocks can feel strange at first.
Once you understand a few basics, the block editor is quick to use and gives you far more layout options without code.
Key takeaways
- Everything in the block editor is a block: paragraphs, headings, images, lists and more.
- Add blocks with the inserter (the plus button) or by typing a slash in a new line.
- Each block has its own toolbar and settings in the sidebar.
- The Document Overview shows a list of all blocks and your heading outline.
- Patterns let you reuse groups of blocks.
- The Command Palette (Ctrl+K or Cmd+K) gives quick access to many actions.
The parts of the editor screen
- Top toolbar: the block inserter, undo and redo, the Document Overview, preview, save and publish.
- Content area: where you write and arrange blocks.
- Block toolbar: appears above the selected block with formatting options.
- Settings sidebar: opened with the Settings button. It has a Post tab (or Page tab) for things like categories, featured image and URL, and a Block tab for the selected block’s options.
How to add a block
- Use the inserter. Click the plus button in the top toolbar, then search or browse for a block.
- Use the slash command. On a new empty line, type a slash followed by the block name, such as /heading or /image, and press Enter.
- Just type. A new line starts a paragraph block automatically.
The blocks you will use most
| Block | Use it for |
|---|---|
| Paragraph | Normal text |
| Heading | Section titles (H2, H3) |
| Image | Single images, with alt text in the block settings |
| List | Bullet or numbered lists |
| Table | Simple comparisons |
| Buttons | Calls to action |
| Quote | Quotations |
| Details | Expandable FAQ answers |
| Group | Wrapping several blocks so they can be styled together |
Moving, copying and removing blocks
- Use the up and down arrows in the block toolbar, or drag the handle, to move a block.
- Open the three-dot menu on the block toolbar to duplicate, copy, insert before or after, or delete it.
- Select several blocks with Shift and click, then move or format them together.
Using the Document Overview
The Document Overview button in the top toolbar opens two useful tabs:
- List View: every block on the page in order. Click any item to jump to it. This is the easiest way to select blocks inside groups.
- Outline: the word count, estimated reading time, number of paragraphs and blocks, and your heading structure.
Check the Outline before publishing. If headings skip levels or appear in a strange order, fix them there. My blog post editing checklist includes this step.
Pro tip
Turn on Top toolbar from the three-dot Options menu if the floating block toolbar gets in your way while writing. Block tools then stay pinned at the top of the screen.
Patterns: reuse groups of blocks
Patterns are ready-made groups of blocks. Your theme may include some, and you can create your own.
For example, if every post ends with the same call to action box, you can save it as a pattern and insert it in seconds. WordPress replaced the older “Reusable blocks” name with patterns, and a synced pattern updates everywhere it is used when you edit it.
Useful keyboard shortcuts
- Ctrl+K or Cmd+K: open the Command Palette. When text is selected inside a block, the same shortcut adds a link.
- Ctrl+A or Cmd+A: select all blocks.
- Shift and click: select several blocks.
- Slash on a new line: quickly insert a block.
WordPress lists the full set in its keyboard shortcuts help, which you can open from the editor’s Options menu.
Block editor or classic editor?
The block editor is the default and is what WordPress develops. The Classic Editor plugin can bring back the old editor, but new features and most modern themes are built around blocks. For a new blog, learning the block editor is the better long-term choice.
Common beginner mistakes
- Using headings for styling. Choose heading levels for structure, not size.
- Skipping alt text. Add it in the Image block settings. See my guide on alt text.
- Pasting from other apps. Pasted text can bring messy formatting. Paste as plain text if blocks look odd.
- Forgetting post settings. Check the category, featured image and URL in the sidebar before publishing.
Frequently asked questions
What is the WordPress block editor?
It is the default WordPress editor, also called Gutenberg, where content is built from blocks such as paragraphs, headings and images.
When did the block editor become the default?
With WordPress 5.0 in December 2018.
How do I add a block quickly?
Type a slash on a new line followed by the block name, or use the plus button in the top toolbar.
Can I go back to the classic editor?
Yes, with the Classic Editor plugin, though the block editor is the default and where new features arrive.
Where do I set the featured image and category?
In the Settings sidebar, on the Post tab.