Getting started with the block editor
A beginner's guide to the WordPress block editor (Gutenberg) — how to write, add content, and publish pages and posts.
The block editor is the main tool you'll use to write and design content in WordPress. It replaced the older editor in 2018, and it's much more powerful — once you understand how it works.
This guide explains the basics so you can edit pages and write posts with confidence.
Quick summary
The block editor works by putting every piece of content into its own "block." A paragraph is a block. An image is a block. A heading is a block. You add, move, and style blocks to build your page. It's a bit like digital building blocks. Once you get the hang of it, it's quite easy to use.
What is a "block"?
In the block editor, everything on a page is a separate block. Think of blocks as content containers — each one holds one type of content:
- A Paragraph block holds text
- An Image block holds a photo
- A Heading block holds a title or subheading
- A Button block holds a clickable button
- A List block holds bullet points or numbered lists
You build a page by stacking blocks on top of each other. You can add as many as you need, rearrange them, and style each one individually.
Opening the block editor
The block editor opens automatically when you click on a page or post to edit it.
Go to your dashboard. Log in to WordPress at yoursite.com/wp-admin.
Click Pages or Posts in the left sidebar, depending on what you want to edit.
Click on the title of the page or post you want to edit. The block editor opens.
Alternatively, browse to a page on your live site while logged in, then click Edit Page in the admin bar.
The editor layout
The block editor has three main areas:
| Area | Location | Purpose |
|---|---|---|
| Top toolbar | Fixed bar at the top | Save, publish, undo, redo, and view options |
| Content canvas | The large central area | Where you write and edit content |
| Settings panel | Collapsible panel on the right | Settings for the selected block or the whole page |
Adding a block
There are several ways to add a new block:
Option 1: Click the + button A blue + button appears when you hover between blocks or at the end of your content. Click it to open the block inserter — a panel showing all available blocks. Click any block to insert it.
Option 2: Slash command
Click at the end of a paragraph and press / (forward slash). A small search box appears. Type the name of the block you want — for example, /image — and press Enter to insert it.
Option 3: Press Enter At the end of a paragraph block, pressing Enter creates a new paragraph block below it.
Working with text (Paragraph blocks)
Paragraph blocks are the most common block. To edit text in a paragraph block:
Click on the text you want to edit. The block becomes active and you can type.
Select text by clicking and dragging, just like in any word processor.
Use the floating toolbar that appears above selected text to make it bold, italic, add a link, and more.
Adding a heading
Headings help organize your content and are important for accessibility and SEO.
Click the + button where you want to insert the heading.
Search for "Heading" in the block inserter and click it.
Type your heading text.
Choose the heading level (H2, H3, H4) in the block toolbar at the top. H2 is the most common for main section titles on a page.
Adding an image
Click the + button where you want the image to appear.
Search for "Image" in the block inserter and click it.
Choose how to add the image. You can upload a new image from your computer, select one from your media library, or insert from a URL.
Add alt text. In the right-hand settings panel, there's a field for "Alt text." Always fill this in — it describes the image for screen readers and helps with SEO. See image sizes, cropping & alt text.
Moving blocks
You can rearrange blocks in two ways:
- Drag and drop — hover over a block, click and hold the six-dot grid icon on the left side of the block, and drag it up or down.
- Arrow buttons — click a block to select it, then use the up and down arrow icons in the block toolbar to move it one position at a time.
Saving and publishing
After making changes to an existing page, click the Update button in the top-right corner. Your changes go live immediately.
For a new post or page that's still a draft, click Publish in the top-right corner. WordPress may ask you to confirm — click Publish again to make it live.
Easy to miss
WordPress autosaves your work as you type, but this autosave is a temporary recovery backup — it doesn't publish your changes. Always click Update or Publish to actually save your work to the live site.
Undoing mistakes
Pressed the wrong key or deleted something by accident? Don't panic.
- Press Ctrl+Z (Windows) or Cmd+Z (Mac) to undo your last action.
- You can undo multiple steps in a row.
- For bigger mistakes, WordPress also keeps a full revision history. See undo mistakes with revisions.
Common questions
Related guides
- Classic editor vs block editor
- Working with blocks
- The most useful blocks, explained
- How to edit a page
- Undo mistakes with revisions
- Drafts, previews, and publishing
Need a hand?
Learn more
The WordPress admin bar explained
A guide to the black bar at the top of WordPress — what every button and link does, and how to use it efficiently.
Classic editor vs block editor
Understand the difference between WordPress's two editing experiences so you know which one you're using and what to expect.