WordPress releases Gutenberg 13.7 – focused on workflow and better UI
WordPress has unveiled Gutenberg 13.7 which contains numerous enhancements that improve workflow, provide more granular control in the full site editor, and numerous user interface improvements.
Like any other WordPress release, this is a cumulative update and not a brand new experience.
That said, the editing experience should be more intuitive and natural.
Block locking offers more granular control
13.7 contains further improvements to the ability to lock block elements to prevent them from changing.
The latest improvement is that users now have the option to apply the lock function to block items contained in a block that is being locked.
By selecting a toggle, the lock function applied to a block can be inherited by the blocks it contains.
Block lock menu
Selecting to lock a block generates another menu that provides options for more granular locking control over the blocks contained within the block that is locked.
Close up of lock modal block
Improved contextual modal menus
Contextual menus, called Modals, can appear at the top of the page being processed from which various changes can be made, such as updating preferences.
What this change does is apply a blur to the document that is under the menu.
Blurring the page under the modal context menu improves focus.
A concern was raised about this new feature (while still in development) that the user could lose context of what was being edited due to blurring.
They suggested that in some cases blurring the background would prevent the user from seeing what was being changed, thus removing the context.
The person wrote:
“I just ran into a potential usability issue where there is an element outside of the modal that is contextually related to the content of the modal.
For example, if you go to adjust an item in the list view to apply or remove a lock, with the modal open you can no longer see which (particular) block you have highlighted…”
The resolution to this problem was the observation that if context had to be kept in mind, the modal (popup) menu is not the best user interface. This means blurring won’t be a problem because modals aren’t used in situations where the underlying document needs to be referenced by the user.
“…generally speaking, if you need to observe both modal content and the rest of the UI, then a modal probably won’t be the best choice.”
Example of blur behind modal
Template system provides more design control
This change allows the user to create more templates that can be specific to categories, tags, pages, and custom post types.
According to WordPress:
“For example, you can use a different template for all personal blog posts, a second for all developer-related blog posts, and a third for all travel posts.
If your site has registered additional post types, such as books or products, your publisher instance will automatically list them in the Add New Template button selection box.
This is a welcome addition as it removes a glaring limitation and expands the ability to build better websites when using the full-featured Gutenberg site editor.
There are other enhancements to improve and streamline the workflow by providing additional options.
Among these changes is the ability to select a featured image from the media placeholder instead of downloading or choosing from the media library.
Screenshot of featured enhanced modal
The reason for this improvement is documented in the pull request:
“This PR enables support for media blocks to give users the option to start with the featured image from the placeholder state.
To avoid having to choose another media only to then get the option and because the featured image is now hidden behind the “Add Media” block control in the media override stream.
New: Time to read
The ability to check how long it will take to read the document is also a new feature that has been added.
This new feature is added to the information bar of the post editor screen which currently provides information on the number of words, characters, heading elements used, number of paragraphs and number of blocks.
The time it takes for an average reader to read a document is very useful information.
Screenshot of updated information bar
Improved the sidebar settings panel UI
Another example of the improved UI can be found in the sidebar settings panel, which is getting an update to make it easier to use.
The settings panel layout is more intuitive and easy to scan and choose from menu selections.
Screenshot of Before and After
WordPress described the improved interface:
“The result is a cleaner, more organized display that should help you more easily access all of the important information about your post/page at a glance.”
So many improvements
The new Gutenberg 13.7 is a cumulative update and not a drastic change from the previous version. The improvements may not be obvious, but they will contribute to a more natural editing experience.
This update touches almost every area of the Gutenberg editor, new components like a color picker, improved document settings, a better full-site editing experience, and lots of bug fixes.
Read the full WordPress announcement
What’s new in Gutenberg 13.7?
Read block lock fetch request
Locking blocks: add option “Apply to internal blocks” #41876
Background blur on modals
Update Modal Design #40781
Get started with a featured image pull request
Start with featured image in media placeholder #41722
Featured image by Shutterstock/Vulp
Modified by author