The WordPress editor looks different now. Here’s why that’s a good thing – and how to start using it like a pro.
If you’ve recently opened the WordPress editor to write a post, you probably noticed something: it doesn’t look like a simple text box anymore.
Instead, every paragraph, image, button, or gallery is its own block. This new editor is called Gutenberg, and it has been the default WordPress editor since version 5.0 (released in December 2018).
When I first encountered Gutenberg a year ago, I was confused. I missed the old Classic Editor. But after spending some time with it, I realized: this is a game changer. Now I can build beautiful, complex layouts without writing code or buying expensive page builders.
In this guide – the first article of a complete Gutenberg & Block Themes series – I’ll explain what Gutenberg is, why blocks are better, and how to get started.
Let’s begin.
What Is Gutenberg?
Gutenberg is not just another editor. It’s the core content editing experience in modern WordPress. It allows you to build pages and posts using blocks – individual components for text, images, videos, buttons, columns, and more.
Think of it like building with LEGO bricks. Each block is a brick. You can add, remove, rearrange, and style each brick independently. This gives you complete control over your layout without touching HTML or CSS.
Gutenberg vs. Classic Editor – Why Blocks Win
To understand Gutenberg’s power, let’s compare it to the old way.
| Feature | Classic Editor | Block Editor (Gutenberg) |
|---|---|---|
| Layouts (columns, groups) | Required HTML/CSS or shortcodes | Built-in Columns, Group, Row blocks – drag & drop |
| Images & galleries | Clunky insertion, limited alignment | Dedicated Image, Gallery, Cover, Media & Text blocks with rich settings |
| Buttons | Required custom HTML or plugins | Native Button block – design right in editor |
| Embeds (YouTube, Twitter) | Manual URL paste | Paste URL – auto-converts to embed block |
| Reusable content | Not possible without plugins | Reusable blocks (sync or not) |
| Full site editing | No | Yes (with block themes) |
In short: Gutenberg turns WordPress from a simple blogging platform into a visual site builder – and it’s built right in, for free.
Anatomy of the Block Editor
Before we dive into individual blocks, let’s understand the editor interface.
1. The Main Content Area
This is where you add and arrange blocks. Each block has its own toolbar (appears when you click on it).
2. Block Toolbar (Top of each block)
When you select a block, a toolbar appears above it with icons for:
- Transform – change block type (e.g., Paragraph → Heading)
- Drag – move block up/down
- Align – left, center, right, wide, full width
- Bold / Italic / Link – text formatting
- More options (three dots) – duplicate, remove, edit as HTML, etc.
3. Settings Sidebar (Right Panel)
Click the gear icon in the top-right corner of the editor to open it. It has two tabs:
- Block tab – settings specific to the selected block (colors, typography, spacing, advanced)
- Post tab – global settings for the post/page (permalink, categories, tags, featured image, excerpt)
4. The Plus Button (+)
Add a new block. Click the blue plus (+) icon anywhere or type / and search for a block name (e.g., /heading, /image).
Types of Blocks (Overview)
WordPress comes with over 60 built-in blocks. They are grouped into categories. Here’s a quick reference:
| Category | Blocks |
|---|---|
| Text | Paragraph, Heading, List, Quote, Code, Pullquote, Table, Verse |
| Media | Image, Gallery, Audio, Video, File, Media & Text, Cover |
| Design | Buttons, Columns, Group, Row, Stack, Spacer, Separator, Page Break |
| Widgets | Shortcode, Archives, Calendar, Categories, Latest Posts, Latest Comments, Search, Social Icons, Tag Cloud, RSS |
| Theme | Navigation, Site Logo, Site Title, Site Tagline, Query Loop, Post Title, Post Content, Post Featured Image, Post Date, Post Author, Post Comments, Post Terms, Login/out, Page List |
| Embeds | YouTube, X (Twitter), Instagram, Vimeo, Spotify, TikTok, SoundCloud, Reddit, GitHub, and 50+ more |
Don’t be overwhelmed. You’ll use maybe 10-15 regularly. The rest are there when you need them.
How to Add and Arrange Blocks
Adding a block
- Click the blue plus (+) button and choose a block from the list.
- Or type / followed by block name (e.g.,
/image,/button).
Moving a block
- Use the up/down arrows in the block toolbar.
- Or drag and drop using the six-dots icon (⋮⋮) next to the toolbar.
Changing block type
- Click the block icon in the toolbar (e.g., the “T” icon for Paragraph).
- Select a different block type (e.g., transform a Paragraph into a Heading).
Deleting a block
- Click the three dots in the toolbar → Remove block.
- Or just select the block and press Delete/Backspace on your keyboard.
Global Styling (The Power of Blocks)
One of Gutenberg’s best features is global styling. You can set site-wide colors, typography, and layout from one place.
If you’re using a block theme (like Kadence supports block-based customization), go to Appearance → Editor (not Customizer). There you’ll find:
- Styles – set global colors, fonts, button styles, and layout presets.
- Templates – edit your site’s structure (header, footer, single post, archive page).
You can even set per‑block default styles. For example, make all Heading blocks use your brand color without touching each one manually.
First Steps After Reading This Guide
- Create a test page – Go to Pages → Add New. Play with blocks. Add a Columns block. Insert an image inside one column, text in another.
- Try the Cover block – It lets you place text over an image or video.
- Experiment with the Query Loop – This block automatically pulls your latest blog posts. It’s magic.
- Switch to a block theme – If you’re still using a classic theme, try Twenty Twenty-Five or Kadence (which has excellent block support). This unlocks Full Site Editing.
What’s Next in This Series?
This is just the beginning. In upcoming articles, I’ll cover:
- Every text block (Paragraph, Heading, List, Quote, Table, etc.) – with settings and use cases.
- Every media block (Image, Gallery, Cover, Audio, Video, File) – including alt text, captions, and responsive design.
- Design blocks (Columns, Group, Row, Stack, Buttons, Spacer) – how to create complex layouts visually.
- Query Loop deep dive – building custom blog feeds, portfolios, and grids.
- Full Site Editing (FSE) – editing your header, footer, and templates directly in the block editor.
- Creating your own block – basic introduction for non‑coders.
Bookmark this page or subscribe to my newsletter – you won’t want to miss the next one.
📌 Key Takeaways (for skimmers)
- Gutenberg is the default WordPress editor since 2018. It replaced the Classic Editor.
- Everything is a block – paragraphs, images, buttons, columns, even your site header and footer.
- Blocks give you visual control – no coding required for most layouts.
- Use the plus (+) button or type / blockname to add blocks.
- Global styles let you design your entire site from one place (if using a block theme).
🔗 Internal links to previous articles (add when published)
- Article #1 – Why I Built My Site
- Article #3 – Installing WordPress
- Article #5 – Building Homepage with Kadence
- Article #6 – Writing First Blog Post
First published: May 10, 2026
Last updated: May 10, 2026