The new WordPress Gutenberg “Group block” explained

It took a while, but it’s finally happening and I’m very excited that the new “group” block was added to the Gutenberg plugin version 5.5 a few days ago. The group block makes it possible to group multiple blocks together while adding some helpful features like background colour.

At the moment the group block is only available in the Gutenberg plugin, but the block will hopefully be added as a standard block to the upcoming WordPress 5.3 release (the 5.2 release is planned for the beginning of May).

Why is the group block so interesting?

At first the new group block doesn’t look like anything special, but I think it’s actually one of the most important blocks added as a WordPress default block so far. At the moment the options available in the group block are very limited. But as the block development continues the group block will play an important role in helping the new WordPress editor grow into a true page builder.

What is the group block?

The group block is a container block, which allows to group multiple child blocks. One of the most useful combinations is to take the group block, include a column block into it and add further blocks inside your columns.

This way you can easily create a multi-column layout with a background colour (and hopefully a background image as well).

The Gutenberg editor as a page builder?

From my perspective the new group block is an exciting development, as Gutenberg is now increasingly becoming a tool to build entire page templates and more complex layouts. The potential to replace traditional page builder plugins for less complex sites is now here.

To date users had to rely on Gutenberg block plugins to be able to group blocks together and create more complex page layouts. Since the block concept is still fairly new and block plugins are in their early stages of development, I would rather not depend on external additional blocks for now, in order to build fundamental page layouts.

As a number of block plugins have already been sold off to larger companies and itโ€™s not completely clear how these will evolve in future, it is currently safer to primarily rely on the default WordPress blocks (especially for core blocks like the group block). This ensures that while block development progresses, my plage layouts will continue to work in future.

However, the block plugin discussion is an important topic that we will soon discuss in more detail in further blog posts.

How can we use the group block right now?

Back to the group block for now. How can we currently use the new block and which features does it already include? Letโ€™s have a quick look at the block options in the editor:

In the toolbar it’s possible to choose between a wide or fullscreen width. Additionally you have the option to change the group block’s background color in the Block Inspector. Here you also have the possibility to add an HTML anchor to each group block on a page. This makes it possible to create a One Page website using a number of group blocks that are linked to the siteโ€™s menu items.

Upon reading the group block discussions onย Github, it sounds like it will probably be possible to add a background image as well as a transparent overlay colour in future.

So, while the group block is still somewhat basic at the moment, there is great potential. I hope that the block will offer more design flexibility, so that it can be used to build more complex page layouts in the Gutenberg editor.

What do you think?

How do you like the new group block? Have you tested the new block already? Which additional features would you like to see in upcoming releases? And what do you think about using the new editor in general? If you have accustomed yourself with the block already, do you have questions we could discuss further here? I would love to hear from you, please leave a comment below.

1 comment on “The new WordPress Gutenberg “Group block” explained

  1. Barry Brunning

    Hello Ellen,

    Thank you for providing the answer to my Google search “Gutenberg group block missing”. I’d conjectured something like versions of Gutenberg in versions of WordPress was the answer. However, I don’t know where to look to see what release of Gutenberg is current in WordPress. Would be nice to know. Any clues?

    Best regards,
    Barry

Leave a Reply

Your email address will not be published. Required fields are marked *