The release of WordPress 5.8 “Tatum” on July 20, 2021, brings tons of exciting new features to the content management system. As the Phase 2 of the 2021 Gutenberg project, this update expands the block editor’s role outside of post and page building. 

Besides incorporating full site editing into WordPress Core, WordPress 5.8 also improves the functionality of the Gutenberg block-based editor. The merge aims to introduce Gutenberg to WordPress users who haven’t yet started using it.

Keep reading as we will cover the full extent of WordPress 5.8, including new features, features, and tools for developers. We will also provide a tutorial on how to update your WordPress version to Tatum.

What’s New in WordPress 5.8: A Quick Overview

The most significant changes in WordPress 5.8 are the new and improved tools for full site editing, giving users complete control over each element within a WordPress site. 

The Template Editing Mode and the block widgets editor make configuring blocks easier for posts and pages. Furthermore, several new theme blocks like Query Loop and Query Block are also available with drag-and-drop functionality and autocomplete shortcuts.

Block-related features display several improvements for better usability. Block toolbars now have a consistent grouping format, while the Reusable Block function prompts a better usage flow. Revision History and Tag Suggestions further streamline users’ work.

WordPress 5.8 also includes Duotone Filters for more convenient image customization and WebP Image Support for faster loading speed. Additionally, users can now embed PDF files to posts.

Developers will find the Global Settings APIs useful for configuring blocks’ settings and features’ accessibility. The Site Health interface allows customization, meaning that developers can register a custom tab navigation and reorder or remove tabs. 

Finally, WordPress 5.8 drops support for Internet Explorer 11. Users may expect a performance improvement as the WordPress Core automated tools will no longer perform updates and release patches for the said browser.

If you haven’t dabbled with WordPress yet, this is the right time to do it. All Hostinger WordPress hosting plans come with developer-friendly features, LiteSpeed Cache, a 30-day money-back guarantee, and WordPress Command Line Interface (WP-CLI). Prices start from as low as ₹69/month.

Full Site Editing and Customization Changes  

Let’s take a closer look at what WordPress 5.8 brings to the table in order to provide a full site editing experience. The following sections will cover all the customization changes and new features to expect from the latest update.

Template Editor

The post editor offers a Template Editing Mode in the settings sidebar that allows users to create, assign, and modify block templates for specific posts and pages.

This mode eliminates the need to use block-based themes to work with Gutenberg. It also makes the entire site-building experience more beginner-friendly, as creating and editing custom templates no longer requires a child theme.

WordPress disables the Template Editor for themes without theme.json configuration by default. However, users can manually enable it in classic themes by adding the following code to the theme’s functions.php file:

add_theme_support( 'block-templates' );

Likewise, block themes and themes with theme.json configuration can opt-out by adding the following line to the theme’s functions.php file:

add_theme_support( 'block-templates' );

WordPress stores custom templates as custom post types labeled wp_template. The template files will be included when exporting the site files, allowing you to reuse them on different websites.

Block-based Widgets

The Widget area, accessible via Appearance -> Widgets, now treats widgets as blocks. Widget Blocks improve the block editor’s flexibility by allowing users to customize each widget without using any third-party plugin.

Users may also add, edit, and preview third-party tools using a Legacy Widget block. WordPress supports Legacy Widget block migration to one or multiple blocks, meaning that users can use classic widgets that aren’t available as blocks yet.

Additionally, WordPress 5.8 comes with 13 new blocks as follows:

• Site Logo ‒ comes with drag-and-drop functionality for resizing the logo image.
• Site Tagline ‒ displays and edits the tagline.
• Site Title ‒ displays the site title and links it to the homepage. 
• Query Loop ‒ more details about this block in the next section.
• Post Title ‒ lets users turn a title into a link, add a link relation, and open the link in a new tab.
• Post Content ‒ only available for creating a list of posts or in a template.
• Post Excerpt ‒ supports standard text formatting and inline settings.
• Post Date ‒ gives the ability to schedule posts or reset the publishing date to turn the post into a draft.
• Post Featured Image ‒ usable in Widget areas and a list of posts. 
• Post Categories ‒ variations of Post Terms.
• Post Tags ‒ variations of Post Terms.
• Log in/out ‒ displays a login form or redirects visitors to the login page.
• Page List ‒ shows a list of pages.

Install the Classic Widgets plugin if you don’t want to enable the Widget Blocks feature yet.

Query Loop

Query Loop is a new block that adopts the WordPress Loop functionality. It lets users display custom lists and post types based on different query parameters and visual configurations without complex coding.

The Query Loop block offers two display types ‒ carousel and grid views. Choosing the Start Blank option gives you four core block variations to choose from.

The block comes with a settings sidebar where users can modify the colors and set filters based on categories, keywords, and authors. You can also set sticky posts and determine the post’s order ‒ only the former is customizable if you choose to inherit the main query.

This block makes querying pagination easier and significantly simplifies the post-retrieval functions. Building additional queries is also possible since the block supports WP_Query class.

Duotone Filters

The Duotone Filters feature, available in the block toolbar, lets you colorize core images and cover blocks ‒ the latter excludes fixed backgrounds. Users can customize images’ shadows and highlights using the color picker or the provided presets.

As duotone uses SVG filters and the CSS filter property, it doesn’t affect the original image. Unlike Instagram filters, it replaces the image’s colors instead of tweaking the color levels. Therefore, it works best for high-contrast images.

PDF Embedder and Viewer

The File Block now equips a PDF embedder and viewer, making displaying PDF files easier and more accessible for visitors. Drag and drop your file to the post editor or click on the File Block to upload it from the library or your local computer.

Toggle with the inline embed option in the sidebar to showcase the embedded PDF version and customize its height using the slider or manually. 

This additional feature is available in most major web browsers. Unfortunately, mobile browsers aren’t supporting this feature yet.

Usability Improvements 

WordPress implements several changes to block-related features for better usability. The following sections will provide a complete breakdown of the improved features. 

List View Panel Changes

Managing nested blocks is easier with the new List View panel. Taking place in the top toolbar, the List View will now remain open as a sidebar. Hovering over one of the blocks will highlight it in the editor while clicking on it will activate the targeted block.

The List View’s new look is much more convenient to use than the old design, which formatted it as a pop-up panel. By turning it into a sidebar, you get to manage complex content without having the panel blocking the editor.

Additionally, all HTML anchors created for the blocks will also be visible in the List View panel. Activate the desired block, then expand the Advanced menu to locate the HTML anchor text box.

Block Toolbar and Parent Block Selector

All core blocks now have a toolbar with normalized sections for a better workflow. The sections follow the content hierarchy, giving a consistent user experience that benefits users who are new to the block editor or manage a large volume of content.

• Block ‒ contains controls for customizing blocks, such as the Block Type Switcher for changing the block type and the Drag tool for relocating the block.
• Tools ‒ provides tools for modifying the block’s content, like the alignment and heading level options.
• Inline formatting ‒ offers tools for in-text formattings, such as the bold and italic options. 
• Other ‒ conveys tools that don’t fit in other three groups.

The additional Parent Block Selector is particularly useful for locating the parent block when editing a complex nested block or column-based text. Hover over any of the active blocks, and the toolbar will automatically expand the option to redirect you to its parent block.

Suggested Patterns

WordPress will now suggest block patterns based on the block and theme you’re currently using when creating a new block. The Patterns tab is located between the Blocks and Reusable tabs, accessible via the Add Block menu.

You can also access it via the Transform menu in each block. It’s a convenient way to create a block in seconds without browsing through the block type list.

As of writing this article, this feature only supports the Heading Block, Query Block, Social Icon Block, Buttons Block, and Paragraph Block. However, WordPress is planning to expand the number of supported blocks and pattern designs in future versions.

Drag-and-Drop Block Handles

The Block handles are visible upon activating a block, making it easier to rearrange the content. It’s located in the first section of the block toolbar.

This additional feature complements the up and down arrows while providing the drag-and-drop functionality as a standalone tool. In the previous version, the said function is embedded in the arrows, which may be confusing for new users.

Autocomplete Shortcut

Typing the slash (/) symbol on an empty block will prompt the editor to display a block types list. As WordPress 5.8 supports multi-word search, you can add keywords after the slash to find a specific block type.

The Autocomplete Shortcut streamlines the manual block adding process, saving you the hassle of browsing through the list of block types.  

Reusable Block and Revision History

If none of the suggested block patterns meets your needs, create a group of blocks and save it as a reusable block. While the process of designing a reusable block remains the same, the new WordPress version will now prompt you to name the block before modifying it.

Like other block types, the reusable blocks are also accessible using the Autocomplete Shortcut feature.

Reusable blocks also support revisions, allowing you to undo changes made to all wp_block custom post types based on the revision history.

Tag Suggestions

WordPress 5.8 saves up to ten of your most used WordPress tags. The suggested tags will automatically refresh as you add new tags.

This tag suggestion feature will help users be consistent with tags and improve the posts’ searchability, therefore improving the site’s search engine rank.

Further Updates and New Features

This section will cover new features that WordPress 5.8 offers as well as updates on web development tools. These new features aim to further improve the user experience of your WordPress site.

WebP Image Support

WebP is an image format developed by Google that provides improved conversion rates without reducing the image’s quality. This file format has smaller size as well as better lossy and lossless compression methods than JPEG and PNG formats.

For this reason, WebP is a popular choice for webmasters looking to improve their site’s loading speed and reduce bandwidth usage.

WordPress 5.8 finally includes the long-awaited WebP image support. Feel free to add WebP images to the WordPress media library without converting them first or using a plugin like the previous version required.

While the new WordPress release has no issue accepting WebP images, the files will trigger an error message if opened on unsupported browsers. Fortunately, most major browsers already support this file format.

Keep in mind that WordPress doesn’t automatically convert images to WebP format. Refer to our guide for optimizing images for WordPress.

Global Settings and Block APIs

WordPress 5.8 introduces a new block configuration called theme.json for controlling settings globally. This feature particularly helps agencies and developers limit clients’ access to certain customization settings and manage the site’s core style preferences.

Creating a theme.json file in the theme’s top-level directory will give you control over:

• Features’ accessibility based on assigned user roles.
• Editor settings, such as font sizes, default colors, and layout widths.
• Individual blocks’ settings, like applying a specific preset to one block only.
• CSS properties coming from the user, theme, and core CSS.
• CSS custom properties and presets.

Top-level settings will affect all blocks with relevant settings. However, block-level settings can override top-level settings if they apply to a specific block type. This feature allows webmasters to modify the settings of each block for individual users.

Using the theme.json file will also reduce the amount of CSS sent to the browser and prevent specificity wars caused by conflicting CSS selectors.

Additionally, WordPress 5.8 comes with new and stabilized block support flags to customize block features. Add the following support flags to the block metadata to enable the additional features:

• color._experimentalDuotone ‒ adds the duotone filter support.
• color.link ‒ mirrors the functionality of color.text support.
• fontSize ‒ the stabilized version of __experimentalFontSize.
• lineHeight ‒ the stabilized version of __experimentalLineHeight.
• spacing ‒ now able to individually control block margin sizes.

Pattern Directory

The new pattern directory provides tons of block patterns created by other users. Browse the available options and copy the desired pattern. Then, paste it to your editor and make the necessary changes.

The available patterns range from buttons, columns, galleries, headers, image-focused blocks, and text-focused blocks. Sort the options based on the latest date and favorites. 

This new feature offers an easy solution to maintain a consistent content layout without designing the pattern from scratch using reusable blocks. 

Extended Site Health Interface

The Site Health feature helps webmasters detect configuration errors and suggests possible improvements for better site performance.

While this feature is already available in the previous version, WordPress 5.8 includes two new hooks that extend the Site Health interface to accommodate custom plugins and themes.

Adding the site_health_navigation_tabs filter to the theme or plugin’s functions.php file will register a new custom tab to the Site Health page. This filter can also rearrange or remove core tabs.

The following example demonstrates how to use the new filter to register the new Hostinger tab.

<?php
function hostinger_site_health_navigation_tabs( $tabs ) {
    // translators: Tab heading for Site Health navigation.
    $tabs['example-site-health-tab'] = esc_html_x( 'Hostinger', 'Site Health', 'text-domain' );
 
    return $tabs;
}
add_filter( 'site_health_navigation_tabs', 'hostinger_site_health_navigation_tabs' );

Meanwhile, the site_health_tab_content action hook expands the Info tab with data relevant to a certain theme or plugin.

Here’s an example of how to use the action hook to include data from a plugin’s file in the Hostinger Site Health tab.

<?php
function hostinger_site_health_tab_content( $tab ) {
    // Do nothing if this is not our tab.
    if ( 'hostinger-site-health-tab' !== $tab ) {
        return;
    }
 
    // Include the interface, kept in a separate file just to differentiate code from views.
    include trailingslashit( plugin_dir_path( __FILE__ ) ) . 'views/site-health-tab.php';
}
add_action( 'site_health_tab_content', 'hostinger_site_health_tab' );

Dropped Support for Internet Explorer 11 

Responding to the rapidly declining use of Internet Explorer 11 over the past years, WordPress 5.8 drops support for the said web browser.

If you’re still using IE11, installing this WordPress version will greatly affect the block editor as the automated tools no longer include updates for the Core source code. Other features relying on the automated tools will no longer work or function properly as well.

WordPress will continue to remove IE11-related code gradually in future versions and will also dismiss bug reports for the said browser.

How to Update to WordPress 5.8

Hostinger users can update their WordPress to the latest version via hPanel. Navigate to WordPress → Overview from your hosting dashboard and scroll down to the WordPress Version. If you use an older version, it will prompt you to install the latest WordPress version.

Alternatively, do it via the WordPress dashboard. A core update notification will appear at the top. Then, select Please update now to start the installation process.

Refer to our guide on updating WordPress for other methods if you cannot do it through hPanel or the WordPress dashboard.

We recommend backing up your website first before initiating the update to prevent losing important data due to incorrect configuration or malware attacks.

What Can We Expect from the Future WordPress Updates

Merging Gutenberg with WordPress is only the second phase of the block editor’s long-term roadmap. Future WordPress updates will focus on fixing bugs and improving the full site editing experience.

A better User Interface also seems likely to be improved over the following years. WordPress is getting more and more popular each and every day, attracting more newcomers that want to build a website of their own, but lack technical prowess.

Since its inception, WordPress was built to be as user-friendly as possible and we can expect that further improvements will be made to reach that goal.

WordPress is planning to release the next major update, WordPress 5.9, on January 25, 2022. It will enter the next phase of Gutenberg – collaboration and multilingual. Expect better ways to co-author content and build multilingual sites in future versions.

Conclusion

WordPress 5.8 brings tons of improvements to the platform. It also initiates the start of Gutenberg’s Phase 2 plan in realizing a full editing experience. Users are no longer required to install the Gutenberg plugin to use the block editor for web development.

Let’s recap the new and optimized features to expect from the latest release:

• Template editing mode
• Block-based widgets
• 13 new block types, including Query Loop
• Duotone filters
• PDF embedder
• Modified List View panel
• More consistent block toolbar with parent block selector function
• Suggested block patterns and pattern directory
• Standalone drag-and-drop block handles
• Autocomplete shortcut
• Reusable block with revision history support
• Automated tag suggestions
• WebP image support
• Global settings with theme.json
• Five new block support flags
• Extended Site Health interface

We hope this article answers everything you want to know about WordPress 5.8. Share your experience using the latest WordPress version down below.