VS Vikesh Singh

Courses WordPress Lesson 8

WORDPRESS · LESSON 8 OF 18

The Block Editor (Gutenberg) Explained

· 4 min read

You now know the difference between Posts and Pages, and how plugins and themes extend WordPress.

You now know the difference between Posts and Pages, and how plugins and themes extend WordPress. This lesson covers the tool you'll actually use to write content inside both Posts and Pages: the block editor, commonly called Gutenberg.

From Classic Editor To Blocks

Before version 5.0, WordPress used a single large text box for writing content, with a toolbar similar to a word processor. The block editor, introduced in late 2018, replaced that with a different idea: every piece of content on the page, a paragraph, an image, a heading, a button, a list, is its own separate "block." You build a post or page by stacking blocks, each with its own settings, instead of typing everything into one continuous text area.

Why did WordPress make this change, given how much it confused existing users at the time? Because a single text box can't cleanly represent complex layouts like columns, embedded media, or custom design elements, without resorting to raw HTML or shortcodes buried in the text. Blocks give each piece of content its own clear boundary and its own settings panel, which scales much better as pages get more complex, and it lays groundwork for visual, no-code page layouts that a plain text box never could support well.

Adding And Using Blocks

To add a block, click the plus icon either in the toolbar or in the empty space below your last block, then search for the block type you want: Paragraph, Heading, Image, List, Quote, Columns, Button, and many more, including blocks added by plugins. Once a block exists, clicking it reveals its own toolbar (usually for things like alignment or text formatting) and, usually, a settings panel on the right side of the screen for deeper options like colors or spacing.

A Common Beginner Habit To Avoid

A very common beginner habit is typing an entire article into a single Paragraph block, pressing Enter only for new paragraphs, and never using Heading blocks at all. This technically "works," but it causes real problems: no visual hierarchy for readers scanning the page, and poor structure for search engines and accessibility tools, which rely on proper heading blocks (not just bold text that looks like a heading) to understand your content's structure.

A better habit: use actual Heading blocks for section titles within a long post, use List blocks for actual lists instead of typing dashes manually, and use Image blocks (not pasted-in HTML) so WordPress can manage image sizing properly. If Vikesh Singh writes a long tutorial post, breaking it into sections with real Heading blocks makes the article easier to skim and easier for search engines to understand, both of which matter for an article meant to actually be found and read.

Moving, Grouping, And Reusing Blocks

Blocks can be moved, by dragging or by using the up/down arrows that appear when a block is selected, and they can be grouped (for example, wrapping several blocks in a Group or Columns block to control layout together). You can also save a block or group of blocks as a "reusable block" (sometimes called a "synced pattern" in newer WordPress versions), which lets you insert the exact same content, like a call-to-action box, across many posts and have it update everywhere at once if you edit it in one place.

If you ever need to see or edit the raw HTML behind a block, each block has an option (usually in its three-dot menu) called "Edit as HTML." This is useful for troubleshooting, but editing raw HTML carelessly can break the block's ability to be edited visually afterward, so use it sparingly and only when you understand what you're changing.

It's also worth knowing about "Patterns," which are ready-made arrangements of several blocks together, like a full testimonial section or a pricing table layout, that you can insert in one click and then edit with your own content. Many themes ship their own pattern libraries, and WordPress itself includes a general pattern library too. For a beginner building a business page quickly, starting from a pattern and editing the text and images inside it is often far faster, and more visually consistent, than building the same layout block by block from scratch.

Try This Practice Post

Before you move on, try this: write a short practice post using at least four different block types (for example: a Heading, two Paragraphs, a List, and an Image), instead of one long Paragraph block. Notice how each block has its own toolbar and settings, and get comfortable moving blocks up and down before you move on to real content.