The Block Editor

[wp101 video=”block-editor”]

In this video, we’ll take a closer look at the WordPress Block Editor, also known as Gutenberg.

Let’s start by creating a new post so you can see how it works. First, add a title. Then, you can either begin typing to create a paragraph block, or type a forward slash / to bring up a list of common blocks.

You can also add a block by clicking the plus icon—either beside the current block or in the top-left corner. If you know the block type you want, you can quickly search for it. Below the search bar, you’ll see a list of commonly used blocks like paragraphs, headings, and lists. Hovering over any block shows a short description and preview.

Blocks are organized by category to make them easy to find:

• Media blocks like images, galleries, audio, and video.
• Design blocks like buttons, columns, and groups.
• Widgets such as custom HTML or a list of recent posts.
• Embeds for YouTube, Instagram, and dozens of other services.

You may also see additional blocks provided by third-party plugins.

At the top of the inserter, there’s also a Block Patterns tab. These are predesigned groups of blocks—like layouts or design elements—that you can insert in one click and then replace with your own content.

Working with Blocks

When you select a block, a toolbar appears above it. The toolbar changes depending on the block type. For example, a paragraph block includes standard text formatting options—alignment, bold, italic, and links.

On the left side of the toolbar, you can convert a block into a different type. For example, a paragraph can be turned into a quote, or styled in a different way. You can also use the arrow icons to move blocks up or down the page.

For even more options, click the three-dot menu on the right side of the toolbar. From here, you can:

• Open the Block Settings panel (for typography, color, or background options).
• Copy, duplicate, or insert blocks above/below.
• Move blocks elsewhere on the page.
• Edit the block’s HTML.
• Save it as a Reusable Block or group it with others for reuse later.
• Or, remove it entirely.

Reusable blocks are especially powerful if you need to repeat the same content across multiple pages.

Editor Settings

In the top-right corner, the Settings button toggles between block-specific options and overall page or post settings.

Click the three-dot menu in the top-right to adjust editor settings:

• Full screen mode hides the admin menu and toolbar, so you can focus on writing.
• Top toolbar places all formatting tools in one bar at the top.
• Spotlight mode highlights only the block you’re working on.
• Code editor lets you view and edit the underlying block markup.

Under Tools, you’ll find:

• The Block Manager to hide or show blocks in the inserter.
• Reusable block management.
• A keyboard shortcut reference.
• The Welcome Guide.
• And an option to copy all content from a page (great for saving or reusing layouts).

In Options, you can enable block validation tests, show your most-used blocks, or toggle panels you don’t use often.

Navigation and Structure

For longer pages, two tools are especially helpful:

• Block Navigation shows a list of all blocks on the page, letting you jump directly to one.
• Content Structure shows word counts, number of headings, paragraphs, and blocks, plus a quick outline.

At the top, you’ll also find undo/redo buttons, as well as the Edit and Select tools. The Edit tool changes content inside blocks, while the Select tool helps you select entire blocks or groups.

Now that you’re familiar with the Block Editor, you’re ready to start creating! In the next videos, we’ll explore how to build custom layouts and create engaging content using the default WordPress blocks.