WordPress 5.4 – New Features, Blocks, and Additional Color Options

On March 31, 2020, we got the WordPress 5.4 right on schedule. The new version is called “Adderley” after American jazz trumpeter Nat Adderley. WordPress 5.4 brings many new features, improvements, and, as always – bug fixes. The block editor gets a lot of love – enhancements to its functionalities, UI, usability, overall improving the editing experience.

Additionally, with the new release, we get some intriguing improvements in both the Site Health Tool and the REST API. Of course, developers are not getting neglected as well. So, let’s dive into the essentials of WordPress 5.4.

Table of Contents

• Accessibility Improvements in the Admin Dashboard
• Block Editor Changes and Additions
  • Welcome Guide Modal
  • New Buttons Block
  • New Social Icons Block
  • Fullscreen Mode Enabled by Default
  • Inline Text Color Support in RichText Blocks
  • More Color Options to Specific Blocks
  • Added Featured Images to the Latest Posts Block
  • Embed TikTok Videos in WordPress
• Site Health Check Feature Improvements
• WordPress 5.4 Changes and Improvements for Developers
• Why You Should Update WordPress
• How to Update to WordPress 5.4

Accessibility Improvements in the Admin Dashboard

Accessibility has always been a priority, and WordPress 5.4 is adding new things to make the admin dashboard more accessible. Some of those are:

• Option to change the image title in the image block;
• Better keyboard navigation in the media modal;
• Improved multi-block selection;
• Better readability of the Privacy Policy Guide;
• Tabbing support in the block’s sidebar.

Block Editor Changes and Additions

The Block Editor is continuing on its rapid streak of improvements. With a total of 10 Gutenberg versions (from 6.6 to 7.5) bundled into the block editor with WordPress, we got a lot of good stuff to mention. In addition to new blocks and features, the editor gets performance improvements, which are always more than welcome.

With each new version of WordPress, we keep getting more and more improvements to the block editor. Version 5.4 is keeping up the pace, bringing a large number of changes to enhance the block editor’s usability.

Welcome Guide Modal

To welcome new users, WordPress adds a Welcome Guide modal to the Block Editor:

This modal will be visible once after you update your WordPress core to version 5.4. If you wish to run it again, you can open it from More tools & options:

New Buttons Block

The Buttons block has been added to Gutenberg 7.2. It replaces the single Button block, allowing all users to include additional buttons to their content, without having to use more blocks.

Not to worry, your previously created Button blocks will continue to work properly, so you do not need to revisit them.

You can choose from two preset styles, as well as fine-tune your buttons’ appearance.

As a site owner, WordPress 5.4 also gives you the opportunity to further tweak the look of your call-to-actions, bringing you gradient backgrounds, which also come with fresh-looking presets that can help you get the gist of things and then turn the designs into your own with some touches here and there.

New Social Icons Block

The Social Icons block gives you the option to add icons with links to social media profiles with ease. The block comes with Gutenberg 7.5, after being tested for a while. It offers a decent amount of social icon child blocks that you can choose from.

The Social Icons block also comes with presets – Default, Logos only, and Pill shape:

Fullscreen Mode Enabled by Default

With WordPress 5.4, the block editor will be opened in Fullscreen Mode by default. Of course, you can toggle that full-screen on and off – just click on the More tools and options at the top-right corner:

Currently, the preference is stored only locally, but in the future, it’s expected to be stored in the database, so that each user can have their choice enabled persistently.

Of course, because not everybody will be very fond of this particular change, Block editor developers can control the fullscreen mode with some JavaScript lines:

const isFullscreenMode = wp.data.select( 'core/edit-post' ).isFeatureActive( 'fullscreenMode' );

if ( isFullscreenMode ) {
 wp.data.dispatch( 'core/edit-post' ).toggleFeature( 'fullscreenMode' );
}

Inline Text Color Support in RichText Blocks

Adding inline text color support in RichText blocks might seem to be a small improvement, but it’s pretty convenient, especially for people that often need to go into HTML just to change the color of a few words. From WordPress 5.4 on, you will be able to select words or sub-strings in RichText blocks and use the built-in color picker to change the color with ease.

Starting with WordPress 5.4, we can select words and substrings in RichText blocks and quickly change their colors using the built-in color picker.

More Color Options to Specific Blocks

In addition to the inline color support for RichText blocks, WordPress 5.4 also brings more color options to some of the blocks. Now they support gradient backgrounds, including a predefined set of gradients. The blocks that get the new color options are the Buttons block, the Group blocks, the Columns block, and the Cover block. Here’s a quick visual example:

Added Featured Images to the Latest Posts Block

Gutenberg 7.5 added the option to include featured images to the Latest Posts Block. This way, the block will get some more attention than usual. What’s more, when uploading featured images to your posts, you can now drag-and-drop them.

Embed TikTok Videos in WordPress 5.4

Just like with YouTube videos, WordPress 5.4 now includes oEmbed support for TikTok videos.

All you need to do is paste the video URL.

Site Health Check Feature Improvements

We have covered the Site Health Check feature in our WordPress 5.2 post. It’s quite a useful feature, and with WordPress 5.4, it gets embedded in the Dashboard. Now everyone can make a quick site health check without having to click on the feature separately.

WordPress 5.4 Changes and Improvements for Developers

With its new version, WordPress is introducing several developer-related changes. It’s important to note that some of those actually break the backward compatibility, so you need to have that in mind.

With version 5.4 of WordPress, theme authors now have access to the Gradients API, for both the cover and the button blocks. Developers should also keep in mind the new social icons and button blocks and make sure their theme blocks styles can handle those new features.

Additionally, several CSS classes within the block editor have been renamed. The HTML markup for the calendar widget has been rewritten and got its classes updated by the WordPress core team.

For the full list of changes that come with WordPress 5.4, you can visit the official Field Guide.

Why You Should Update WordPress

Here are the main reasons you should update WordPress core, plugins, and theme:

• Enhanced protection against security vulnerabilities;
• A lot of new features which improve, expand and refine the CMS overall;
• Better results in usability, accessibility, performance, and more. 

So, when you update your WordPress site, you will undoubtedly get the best version of WordPress.

How to Update to WordPress 5.4

When updating your WordPress core, we always recommend that you utilize the one-click staging environment. Doing that will clone your WordPress site and you will be able to test WordPress 5.4 safely, without the risks of breaking your live website.

Additionally, it’s in your interest to create a manual backup of your live site, just to be completely sure everything is safe.

Updating to WordPress 5.4 is quite easy. All you need to do is click on the updates icon in your admin dashboard and then click on Update Now. While updating, your site will go into maintenance mode, but as soon as the update is finished, everything will go back to normal. 

When you’re done with the update, you will see the new welcome guide.

Conclusion

Things are getting more and more exciting with each new version of WordPress. With WordPress 5.4, we are seeing a lot of improvements, especially to the block editor.

Use the comment section to let us know which one of the updates you consider the most intriguing. Also, if you have ideas of some parts of WordPress that need improvement, feel free to share that as well, and we can have a discussion. Happy blogging!