Using the Block Editor (Gutenberg) Basics

Using the Block Editor (Gutenberg) Basics

The WordPress Block Editor (also called Gutenberg) is the tool you use to create and edit pages and posts. Instead of one large text box, the editor is made up of individual content blocks.

Each paragraph, heading, image, or button is its own block.

Once you understand how blocks work, editing becomes much easier and more flexible.

What Is a Block?

A block is a single piece of content.

Examples of blocks include:

  • Paragraph

  • Heading

  • Image

  • List

  • Button

  • Columns

  • Spacer

Each block can be edited, moved, duplicated, or removed independently.

Think of blocks like building pieces. You stack them to build a page.

How to Add a Block

To add a block:

  1. Click inside the editor.

  2. Click the plus (+) icon.

  3. Choose the block type.

  4. Start adding content.

You can also type a forward slash ( / ) and begin typing the block name to quickly insert one.

Example:

Typing “/image” allows you to insert an Image block.

The Most Common Blocks You’ll Use

  • Paragraph: Used for normal body text.

  • Heading: Used for section titles. Choose the correct heading level (H2, H3, etc.).

  • Image: Used for adding photos or graphics.

  • List: Used for bullet or numbered lists.

  • Button: Used for calls to action, such as “Learn More” or “Contact Us.”

These blocks cover most everyday content needs.

How to Edit a Block

To edit a block:

  • Click inside it.

  • Make changes directly.

  • Use the formatting toolbar above the block.

Each block has its own settings panel on the right side of the screen.

Settings may include:

  • Alignment

  • Color

  • Spacing

  • Size

  • Advanced options

Only adjust advanced settings if you understand their impact.

How to Move Blocks

To move a block:

  • Hover over it.

  • Click the up or down arrows.

  • Or drag it using the six-dot handle.

This allows you to reorganize sections easily without cutting and pasting.

How to Duplicate a Block

To duplicate:

  1. Click the three-dot menu on the block toolbar.

  2. Choose Duplicate.

This is helpful when creating similar sections.

How to Delete a Block

To remove a block:

  1. Click the block.

  2. Click the three-dot menu.

  3. Choose Remove Block.

Be careful when deleting layout blocks, as they may contain other nested blocks.

Understanding Block Settings (Right Sidebar)

When a block is selected, the right panel shows settings specific to that block.

Examples:

Paragraph block may show:

  • Text color

  • Background color

  • Typography options

Image block may show:

  • Alt text

  • Image size

  • Alignment

Always review settings if something looks incorrect.

What Are Layout Blocks?

Some blocks control structure rather than content.

Examples:

  • Columns

  • Group

  • Row

  • Stack

  • Cover

These blocks help organize content into sections and layouts.

Be cautious when deleting layout blocks, as they often contain multiple inner blocks.

Using Headings Properly

Headings should follow a logical order:

  • H1 (usually the page title)

  • H2 for major sections

  • H3 for subsections

Avoid skipping heading levels randomly.

This improves readability and accessibility.

Block Toolbar vs Sidebar

There are two places to adjust block settings:

Block Toolbar (above the block)

Used for quick formatting like bold, alignment, or linking.

Used for deeper settings such as color, spacing, or layout options.

If you don’t see the sidebar, click the settings icon in the top right corner.

Common Mistakes to Avoid

  • Using large bold text instead of heading blocks

  • Deleting layout containers accidentally

  • Adding too many different formatting styles

  • Copying heavily formatted text from Word without cleaning it

Keep formatting simple and consistent.

A Safe Editing Approach

When working with blocks:

  1. Add content one section at a time.

  2. Use headings to organize content.

  3. Preview before publishing.

  4. Avoid changing advanced settings unless necessary.

This keeps your layout stable.

Why the Block Editor Is Powerful

The Block Editor allows you to:

  • Rearrange content easily

  • Add structured layouts

  • Create flexible designs

  • Edit sections independently

It provides more control than traditional text editors while remaining user-friendly.

Summary

The Block Editor is made up of individual content blocks. Each block can be:

  • Added

  • Edited

  • Moved

  • Duplicated

  • Removed

Most users primarily use Paragraph, Heading, Image, List, and Button blocks.

Once you understand how blocks work, creating and editing pages becomes much more intuitive.

    • Related Articles

    • Common Content Blocks You’ll Use Most Often

      The WordPress Block Editor includes many different block types, but most users rely on just a small group for everyday content updates. Understanding these core blocks will allow you to build clean, professional pages without overcomplicating your ...
    • How to Create a New Page

      Creating a new page in WordPress allows you to add permanent content to your website, such as service descriptions, informational content, or new landing pages. This guide walks you step-by-step through creating and publishing a page correctly. When ...
    • How to Edit an Existing Page

      Editing an existing page is one of the most common tasks in WordPress. Whether you’re updating text, replacing an image, or adding new content, the process is straightforward once you understand the steps. This guide explains how to safely locate, ...