WordPress 5.4 “Adderley”

New release

On 31st of March 2020, we are happy to meet the new version of WordPress, which is WordPress 5.4! According to the WordPress 5.4 Field Guide this is an update more oriented to the developers, less to the end users, accessibility and the privacy. So WordPress plugins and themes developers, prepare your software! We are also happy to announce that the new version of WPCacheOn 2.0 is completely compatible with WordPress 5.4 as well as with PHP 7.4!

Changes and new things

We always cherished the users, so we will start reviewing the end user improvements and go through the dev changes in WordPress 5.4.

Block Editor

Over the past year we have heard and read many different opinions on embedding Gutenberg in WordPress. However the amazing community of WordPress do not stop to improve the built-in editor from both angels – user experience and code optimizations, which in our impression are equally important.

In WordPress 5.4 the Core Developers have embedded Gutenberg 7.6. This update achieve 14% reduction of the editor loading time and up to 51% reduction of the time-to-type. Please note that this change is most noticeable in long posts of 36,000 words and/or 1,000 blocks or more of course. This is some great numbers if you ask us! Bravo to the WordPress Core Developers Team!

New blocks in WordPress 5.4

Social Icons buttons

This new block in WordPress 5.4 (originally presented in Gutenberg 6.5 as experimental feature named Social Links) is extremely helpful for adding Social Icons to your page and blog post. In this new version of WordPress the new block allow the users to easily link their social media accounts by using only the logo of the chosen social media. Due to improvements over the Block Variations API this feature is more simple and stable, just enough to be included in WordPress 5.4.

This “re-implementation” is huge change in the way that the Social Icons are saved. Websites having active Gutenberg plugin since September could be potentially concerned. The reason for this concern is that in WordPress 5.4 the core block editor will not recognize the Social Icons blocks built before Gutenberg 7.5.

There are two relevant easy and convenient methods to deal with this:

• The recommended method by the WordPress Core Developers is to manually migrate any content with the old Social Icons. Here is how: first load your post in the block editor (Gutenberg 7.5 or higher) and save it. In this way the block editor will automatically update its content. 
• The other way to do this is to keep the Gutenberg plugin installed after upgrading to WordPress 5.4. Afterwards the plugin will give you manual backwards compatibility for the old Social Icons.

Buttons block

This new (awesome!) block is a collection of buttons, because we all that write content in WordPress often need to use few of them at a time. For example – “Download” and “Read more” buttons are always welcome!

The Buttons block will shows each button as an individual button-block child of the Buttons block (yes, we know it sounds a bit tangled). This basically means that the authors will be unable to insert a button block outside Buttons. Instead the existing button blocks will work the way they always have.

If you were using a button block as part of template or another web page builder plugin system that automatically insert button block, you might want to use the Buttons block with a nested button instead. This will guarantee more cleaner code on the backend which will have direct effect on the page loading.

Another plus is that you will not need to migrate your existing button blocks. The great WordPress Core Developers have thinked of this and it occur that they will just work 5.4 version as they have before.

Fullscreen mode enabled by default in the editor

With WordPress 5.4, the editor behaves a bit differently than we are used to. The first time you open the editor in a new installation, on a new device or of course if there is reset of the user preferences in the WordPress admin dashboard.

Now the editor opens in fullscreen mode by default. Since this is a local setting, this is why it will be going to reset when your preferences do, this also includes incognito browser mode. Also in future releases this setting will be stored in the WordPress database.

Of course you may not like that, so you can turn if off. It is quite simple – just use the pulldown options (three dot menu) in the editor menu, next to the cog wheel icon and chose “Top toolbar” option:

Surely the smart Core Developers have added an option this feature to be changed programmatically with a data module. The below code is example how to do this in JavaScript:

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

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

Keyboard shortcuts in WordPress 5.4 editor

In WordPress 5.4 we will notice new package named @wordpress/keyboard-shortcuts which will centralize the registration, removal and documentation of the available keyboard shortcuts in the block editor. This is quite deep matter to cover as many code examples have to be shown and explained. This also become more development oriented, so we will not mention more on this matter. However you can see the whole information with the code examples here.

General Block editor and API updates

Meta attribute sources deprecated in 5.4

The WordPress Core Developers have decided to deprecate meta attribute sources in the 5.4 version. Do not worry, as according to the Developers the existing code that uses these attributes should still work.

Your existing code that uses these attributes should still work, but there’s a new way to get where you want to go.

Instead of meta attributes, use EntityProvider and related hooks APIs. The EntityProvider and related hooks APIs provide a more flexible and powerful way to build blocks that source data from a variety of properties of WordPress entities and data.

New AsyncModeProvider API

Since literally nobody like lag especially while writing, now the Block Editor use Async Rendering Mode. This means that the selected block gets rerendered synchronously on each change, while the unselected blocks only refresh when the browser goes idle.

Thanks to the Async Mode now implemented in the wordpress/data package, we can enjoy this improvement. Also in WordPress 5.4 you can use the same type of asynchronous behavior for speeding up things in another React state tree only if they rely on the data module.

Improved drag-and-drop

We saw (it seems that the Core Developers saw it too) many complaints about drag-and-drop being more like swing-and-miss. In order to improve this from WordPress 5.4 the positioning classes that rendered in the DropZone component (is-close-to-top, is-close-to-bottom, is-close-to-left and is-close-to-right) are gone. Actually the whole dropzone is gone. This gives the users much bigger target to grab in the blocks they want to move. So easier grab, easier drag and we all are happier now!

New Guide component

This is a pretty awesome new component! The new Guide component is now added to the @wordpress/components package (wp.components.Guide). The Guide will allow the developers to create with ease step-by-step guide to display to the users. The block editor uses Guide to implement new welcome modal which appears on first launch.

The Guide component is actually a React component that renders a “user guide” in a modal. The guide on itself consists of several GuidePage components which the user can step through one by one. The guide is finished when the modal is closed or when the user clicks “Finish” on the last page of the guide.

Deprecation of wordpress/nux

Since version 5.4 the @wordpress/nux package (wp.nux) is deprecated along with the DotTip component that it contained. Importing this package will display warning in the browser dev console. The Core Developers recommendation is that plugins or themes using wp.nux and DotTip to migrate to the new Guide component instead.

Customizer

In WordPress 5.4 there are improvements of the accessibility of focused elements This is a follow-up to previous WordPress 5.3 Admin CSS changes, adds documentation of existing Customizer functions and hooks, removes apple-touch-icon-precomposed deprecated meta tags, and improves Menu items selection logic.

Menus

In WordPress 5.4 the Menus component have 5 updates! They aim to improve the keyboard accessibility of the Menu items selection tab panel and streamlines in the user interface. If your plugin or theme add custom fields to menu items, you might want to update your code to use the new wp_nav_menu_item_custom_fields hook.

Privacy

There were 15 updates on the Privacy component in the WordPress 5.4. Some of them that got our attention are:

• Personal Data Export now includes Session Tokens, Community Events Location and Custom User Meta
• Personal Data Exports now include a JSON file and a Table of Contents
• New filters for the headers of all Privacy-related emails
• The privacy tables are improved for a cleaner interface
• wp_get_user_request_data() function was replaced with wp_get_user_request() for better clarity

Complete guide on these changes is in the dev notes here.

REST API

With total of 22 updates related to the REST API, WordPress 5.4 now supports “OR” taxonomy relation parameter in Post Controller, adds selective link embedding and introduces some changes in the WP_REST_Server method. Again the whole information in details on these updates can be seen here.

Shortcodes

In total there are 3 updates to the Shortcodes component in WordPress 5.4. To us will be introduced documentation improvements and a new function: apply_shortcodes. This new function is an alias of do_shortcode, which will be still supported. The semantics of do_* implies the function displays the result of the shortcode. But that is not the case. In fact the function do_shortcode() needs to be echoed to display its result.

According to the Core Dev Team the old do_shortcode() function is used in many plugins and themes. So currently it will be not deprecated. But if the community can start building a consensus around the new function – apply_shortcodes(), then deprecation may eventually become a real option in the future. There is a precedent for making this move. It is the same process the Core Team followed with the  get_permalink() and get_the_permalink() functions.

Widget

In WordPress 5.4 there is also an update on the Widget component. This update introduces accessibility and user interface enhancements on the Widgets Admin screen and changes in the Recent Comments and Calendar Widgets HTML markup.

Additional developers update

wp-env or Local Environments for WordPress

Local WordPress environments are now made simple! Simple as running one command. The wp-env is zero config tool for local WordPress environments. It provides decisions over options so that users can quickly spin up WordPress without wasting time. The end goal here is to make these environment easily accessible to all — no matter if you are developer, designer, manager, or actually . . . well anyone. It is pretty straightforward process:

1. From the directory of your WordPress source code, plugin, or theme, run wp-env start.
2. Access the instance on localhost:8888. The local code is already deployed, mapped and ready for development!

In this basic example, there is no configuration at all. The wp-env creates a Docker instance behind the scenes with the latest WordPress image and then maps the local theme or plugin to the environment as a Docker volume. This way, any changes you make to the code locally are reflected immediately in the WordPress instance.

Note: wp-env requires both Docker and Node. Once these prerequisites are met, you can run npm install -g @wordpress/env to install wp-env locally. Feel free to test it out and share your impression of this feature in the comments!

Improvements in favicon handling

In WordPress 3.0 the wp_favicon_request() function was introduced with the idea to avoid the performance hit that comes from serving a complete 404 page on every favicon request. While that function works as intended, it simply does not offer enough flexibility.

As of WordPress 5.4, theme and plugin authors can manage favicon requests much more flexibly, with the next logic:

• If there is a Site Icon set in Customizer, redirect /favicon.ico requests to that icon.
• Otherwise, use the WordPress logo as a default icon.
• If a physical /favicon.ico file exists, do nothing and let the server handle the request.

Note: This logic will only work if WordPress is installed in the root directory.

Also with these changes, /favicon.ico handling is now consistent with the /robots.txt requests.

Miscellaneous Developer Focused Changes in WordPress 5.4

OK, so these are really some miscellaneous changes, so we will not go deep in them, but only mention them as interesting altered things, you can see more details about them here. Below we will show the changes formatted in list:

• Better information about errors in wp_login_failed
• Multisite: add site ID to newblog_notify_siteadmin filter
• Introducing TikTok videos embed
• Removal of CollegeHumor video embed
• Media: store the original URL of the attachment in the _source_url post meta value
• Accessibility: the Admin Bar is now loaded with wp_body_open when available
• Widgets: avoid duplicate IDs in Recent Comments
• Login and Registration: new parameter passed into the lostpassword_post action in retrieve_password()
• Theme headers support “Requires at least” and “Requires PHP” declarations
• delete_posts without triggering PHP notices – in every post type

Some miscellaneous statistics

According to the WordPress Core Developers in WordPress 5.4 there are over 198 squashed bugs, exactly 121 enhancements and feature requests, and 8 blessed tasks completed.

Even more information

You can see more information about each of the new features and updates in WordPress 5.4 in the WordPress Field Guide.

WordPress 5.4 and WPCacheOn

In WordPress 5.3 we have witnessed one “new” optimized and more secure platform. With WordPress 5.4 we have new user features and so much code improvements. Of course this means more flexibility from development point of view and faster loading platform. Well, well we all know that the speed can be always improved more! This is where WPCacheOn comes in place! WPCacheOn provide cache, PreCache, gzip and other features that will speed up your WordPress website instantly! Only installation and activation are required!

We have also performed thorough tests on WordPress 5.4 and we are very happy to announce that WPCacheOn the WordPress speed up plugin is 100% compatible with WordPress 5.4 and the latest PHP 7.4 version! With that in mind, go ahead and update your WordPress website as soon as possible in order to benefit from the latest WordPress release updates! Tell us your experience and impression about WordPress 5.4, we are eager to hear your thoughts!

Happy blogging and coding!