Gutenberg 11.5 adds grouping of widgets, iterates over Block Gap, and updates navigation menus – WP Tavern

Gutenberg 11.5 landed earlier today. This is a hefty version that includes significant navigation block changes, a new way to group widgets, and deeper integration of block spread functionality.

I had mixed reactions on the features that were part of the last version. There were times when I thought to myself, finally, it made it in. At other times, I rendered my best version of Jean-Luc Picard’s famous facepalm. But the wheel continues to turn and the developers who devote their time and effort to the project continue to improve it.

A quick note is that anyone who isn’t running a theme that supports Block Editor should check that their backend styles aren’t moved. Gutenberg automatically generates some default editor styles if the user’s active theme doesn’t save their own or doesn’t have a theme.json file present. This should be bundled into an intermediate release like WordPress 5.8.2 so that users don’t expect it until 5.9.

Changes to the navigation block

As navigation menus are always a sore point in site editing, Gutenberg has added new levels of complexity. The Site Title and Site Logo blocks are allowed inside the navigation container.

As Joen Asmussen shared in the original post, there are some complex layouts that would benefit from allowing more internals in the navigation block:

This could open up a world of layout possibilities for theme authors through custom templates.

I have no problem with Gutenberg tackling the basics of these more advanced layouts. However, we still need to smooth the basics of navigation. The experience of finding and inserting links on the site is lackluster at best, requiring several mouse clicks. There is an open ticket for a lighter browsing experience, and that should be the goal.

Theme authors should also note that the Navigation block now relies on CSS gap property for spacing instead of margin. I’ve almost missed it since I customized it for my own projects months ago – welcome to 2021, where we no longer need to rely on bogus margin solutions for simple spacing. This change could impact existing theme designs.

FSE administration notice limited to the themes screen

The only administrator’s opinion of the ESF theme.

There are a lot of complaints to be made with the Gutenberg plugin as its functionality is constantly evolving. However, the most annoying thing about running the plugin has been its persistent, non-revocable admin notification when a user runs a block theme.

In previous versions of the plugin, this notice appeared on every screen in the backend. Now it only appears on the Themes / Appearance page.

For the past few months, I have kept the Ben Gillbanks Toolbelt plugin active for the sole purpose of hiding this notice.

Good riddance. Goodbye.

Widget group block

Widgets screen in the WordPress admin with the new Widget Group block displayed.
Editing a widget group block title.

While I generally think core Gutenberg and WordPress plugin developers make good use of comments, the block-based widget system has been one area where the project dropped the ball. As I have been repeating since September 2020, the functionality was fundamentally broken. The goal was to allow end users to add blocks to more places, but this was never compatible with classic markup and theme styles.

I suggested using templates, but the team opted for a widget group block. The end result is similar but not exactly the same. The good news is that it fixes what should have been a blocker for the feature landing in the kernel.

The best news is that this should happen in WordPress 5.8.2 instead of 5.9 later this year.

I wouldn’t go so far as to call it a perfect solution. The experience does not immediately indicate how to add a widget title. Users must first add a block. Once a block is added, they can then click on the title / title placeholder that appears. Then the user interface switches to a field to enter the title.

The following video shows how the Widget Group block works:

I would rather have a little janky experience than no solution at all. At least, users no longer have to manually create widget wrappers. Some might even disable the Classic Widgets plugin if this issue was a heist.

Group variation of “lines” and flexible arrangements

Post author, date, and comment link are aligned next to each other using the new variant of Row block.
Addition of a post meta (byline) section with the variation of the Row block.

To start testing the new flexible layout system introduced in Gutenberg 11.2, the development team added a variant to the Group block named Row. This allows users to line up interior blocks side by side rather than on top of each other in the default “flow” layout.

There are tons of use cases for the feature. One of the main scenarios for theme authors will be to align the post and comment metadata blocks next to each other. Previously, this required using the Columns block or custom styles, which weren’t ideal.

The experience is rough around the edges. I often struggled to click in the right place to edit a block, and the add button didn’t always appear to add new ones.

The Social Icons block also uses the new flexible layout. However, there is currently no way to get it to go into feed mode for vertical social links.

More block gap integration

Highlighted spacing / space between individual column blocks.
Space between each column block.

The Columns block now uses the spacing feature introduced in Gutenberg 11.4 to manage the spacing between individual Column blocks. There’s no UI yet for end users to control this, but it’s likely to land in a future version as the feature evolves.

Gutenberg 11.5 has now added a bottom margin to the post title in the editor. For some reason, the development team took a leap forward and assumed that their current handling of the block gap functionality needed it. It is a complex problem to solve. In the meantime, some users may see more spaces than usual between their title and content in the editor.

Unusual amount of white space between post title and content in Block Editor.
Lots of extra spacing there.

Of course, that depends on the active theme, its support for the block gap feature, and its current styles.

Post Author Duotone Support

For something that was supposed to be scrapped, the Post Author block now has new life in the form of two-color filter support for its avatar. It works the same as for other blocks, such as Image and Cover.

The problem is that Post Author was removed from the latest version of WordPress because it was not yet ready. The block is a Frankenstein-esque mashup of author name, avatar and description. These should be multiple blocks that theme authors and users can organize into unique layouts.

While the duotone support just adds an extra line of code, it doesn’t make sense to continue working on the block in its current form. I’d love to see it as part of a separate post-author Avatar block.

Comments are closed.