WordPress released Gutenberg version 13.0 which includes numerous improvements that bring it several big steps closer to becoming the easy to use website builder it is intended to be.
This update to Gutenberg is an important milestone because the features in this plugin will be included within the core of WordPress 6.0, which is currently set for release on May 24, 2022 and that’s a very big deal in the world of publishing.
WordPress Gutenberg Editor
Gutenberg is a visual style website builder designed to make building websites easier for publishers.
It’s called visual to describe the process of building a site using a drag and drop or point and click interface on a virtual canvas that can be visualized how it’s going to appear as you design it.
Instead of manipulating code, with this style of website building the publisher is manipulating web page elements like the header or footer. Those web page elements are called Blocks.
This is a way of building websites that’s been around for a long time in different forms, since at least the late 1990’s with the introduction of the Macromedia (now Adobe) Dreamweaver website building software.
Back then this style of creating web pages was commonly referred to as a What You See is What You Get (WYSIWYG) interface.
WordPress plugins such as Divi and non-WordPress SaaS website building platforms have for years helped publishers build sites with a visual website builder interface.
Gutenberg is WordPress’ version of the visual website builder interface which makes it easier to build a website.
The benefit of Gutenberg is that it is a part of the WordPress core itself, which (in theory) helps to make websites built with Gutenberg perform faster than using a third party plugin.
Gutenberg 13.0 offers multiple improvements that will help WordPress 6.0 be a significant step forward for the world of publishing and that’s very exciting.
Gutenberg Blocks
Gutenberg’s design interface is described using the word, blocks. For design purposes, a web page is divided into sections called blocks.
The top part known as the header is a block. The navigation menu is a block. And the sides where various widgets go is also a block.
Each block can be moved around and manipulated in order to create a web page design.
So, the block at the top of the page where the featured image goes can be individually styled with a point and click ease. Just click the block you want to add text to or a background image to and then choose from a contextual menu to do what you want to do.
Select Text Across Blocks
An innovative improvement introduced into Gutenberg 13.0 (and into WordPress 6.0) is the ability to select text across multiple blocks. This is important because blocks exist as a way to design what the web page looks like and text is something that’s dropped inside those blocks.
This new feature offers a publisher more freedom to create a web page without being constrained by (seemingly) arbitrary rules such as not being able to select text across multiple blocks.
Page Level Patterns
This is a breakthrough feature that moves Gutenberg several strides closer to being an easy to use website builder.
The patterns feature was introduced in 2020 in Gutenberg version 7.8 as an API for developers to use to create layout patterns for sections of a page.
What the latest version of the patterns feature does is enable page templates that can be selected as a starting point for creating a web page layout.
So instead of starting a web page from scratch a publisher can start with a pre-configured pattern for an entire page and then customize the page from there.
This is a feature that’s already common in many existing WordPress page builders as well as in SaaS website builders. So it’s a definite step forward for WordPress to finally have this feature.
Stack or Row Layout Manipulation
Continuing with the goal of making WordPress easy to design, the new version of Gutenberg allows organizing selected blocks as a layout of blocks or rows.
And from there a publisher can use the contextual menu to further manipulate the design.
Here’s a video showing how it works:
The WordPress announcement described it:
“Blocks are now easily grouped into either a Stack layout or a Row layout with a single click.
In Gutenberg 13.0, selecting many blocks at once exposes the Stack and Row variations of the Group block right in the toolbar.”
Block Border Control
This is a refinement of an already existing feature with a new BorderControl component.
A contextual menu provides a way to control the borders around the block to change the style, color and width.
Use Featured Image in Cover Block Button
A cover block is a specialized block that can be used to create the hero image section at the top of the page. The background of the block can be a color, an image or a video.
The update to the cover block adds a button so that it can instantly use the featured image for the web page.
It sounds like a minor thing but it’s actually an important functionality.
The WordPress announcement enthused:
“With the updated Cover block, the post’s featured image is no longer an afterthought – it is an integral part of the post. Just click the “Use Featured Image” button, and that’s it!”
There are many more cumulative improvements to Gutenberg 13.0 that together contribute to making this a meaningful update to the WordPress block editor which will eventually make it to the next version of WordPress, version 6.0.