What’s New in WordPress 6.3 marks the second significant milestone in Phase 2 of the WordPress roadmap. This release introduces a plethora of captivating novel features and enhancements.
If you are someone who uses, develops for, or has a strong interest in WordPress, it’s valuable to understand what to anticipate from the latest features and how to make the most out of them.
In this dialogue, we will explore the latest enhancements and modifications in WordPress 6.3, focusing on how these updates will elevate your website editing experience.
As per W3Tech, the latest Version 6 of WordPress is employed by 71.9% of all its websites. WordPress exhibits a continuous process of enhancement and development, attributed to its open-source community of active contributors and users. Now, let’s delve into the enhancements brought about by WordPress 6.3?
When Is WordPress 6.3 Rolling Out?
The initial release candidate of WordPress 6.3 Beta became available for download and testing on July 19th, 2023. However, it’s important to note that this particular version is not suitable for direct installation and use within your production environments. Consider conducting additional testing solely on a dedicated test server and site. The expected launch date for the official version is August 8th, 2023.
What’s New in WordPress 6.3
While the official release is still pending, the Beta version provides us with insights into the upcoming features of WordPress 6.3. The development team has primarily concentrated on improvements within the Gutenberg framework.
Since its launch in November 2018, Gutenberg has consistently formed the core of nearly all WordPress updates. This focus has been leveraged by the editors in their latest update.
Let’s examine.
Block Improvement
Gutenberg’s core centers on blocks, and as WordPress 6.3 approaches, it promises substantial changes and improvements to the block system.
In this version, two new blocks have been introduced.
1. Details: This innovative section incorporates a heading along with a collapsible content area. The Details block proves to be a valuable tool for presenting comprehensive information in a concise format. It can be effectively utilized for demonstrating code excerpts, concealing spoilers, and outlining product specifications.
2. Footnotes: An additional feature is the Footnotes block, which allows you to incorporate citations. Here’s how to utilize this functionality:
- Select the text you want to cite.
- Please click the More option on the block toolbar.
- Select Footnote.
The block popup will appear at the conclusion of the content automatically.
Enhanced Navigation
Similar to any significant WordPress update, the Site Editor has undergone notable improvements. To start, the navigation sidebar expands, enhancing user-friendliness. Developers have dedicated efforts to create a more intuitive and smooth editing experience by concentrating on the following aspects.
1. Navigation:
Here, you can view the links accessible in your navigation block. While you have the flexibility to rearrange or eliminate menu items, you also have the option to introduce new links.
2. Styles:
The Revisions feature has been employed to revert alterations made to your posts and pages. This capability will now be accessible within the Styles menu in the Site Editor.
This functionality will allow you to visualize the modifications applied to your theme styles and revert them if necessary. Here’s the process:
- Open the Styles panel.
- Choose a style or block you want to edit.
- Save the changes.
- Click on the Revisions button.
- Then select Revision History.
- Switch between different versions.
- Click the Apply button to return to a previous version.
3. Pages: This new functionality allows you to conveniently access the ‘Pages’ section from the navigation menu in the editor. Upon selecting this option, you will be able to view the pages that have been edited most recently.
To put it differently, you have the ability to swiftly continue with your revisions. Utilize the “+” icon to introduce a fresh page. What’s of greater significance is your capability to promptly make edits within the Site Editor.
4. Templates: This feature closely resembles the one in the current WordPress version. Here, you can locate all available templates and edit the specific one you desire. Additionally, you have the capability to create a new template within this section.
5. Patterns: The upcoming 6.3 version will introduce an enhanced method for pattern management. Users will have the convenience of viewing all patterns directly within the editor. Choosing this option will display a comprehensive list of available patterns, including both synced and unsynced variations.
Here are a few things you need to remember:
a. Using Unsynced Patterns
You can incorporate unsynchronized independent patterns as standalone elements whenever you prefer. You can also introduce modifications after including them. Importantly, these adjustments to the unsynced patterns will have no impact on your original pattern.
b. Using Unsynced Patterns
Conversely, modifying synchronized patterns will impact your initial pattern since these are essentially reusable components. Thus, all reusable blocks will be displayed in this location, now referred to as “Synced Patterns,” instead.
Command Tool
WordPress 6.3 will introduce a new Command Tool, which is currently in the experimental phase within the Gutenberg platform. This tool functions as a Command Center, facilitating swift execution of desired actions.
You can use it to:
- Navigate between templates.
- Open specific panels.
- Create a new post or page.
This tool can be located at the top of the Site Editor. Alternatively, you can utilize the CTRL+K shortcut to access the command tool. Once the tool is open, you can begin typing to search for your desired content.
For a comprehensive list of available commands, you can retrieve the accessible command roster by executing the following line in your browser’s console: wp.data.select(wp.commands.store).getCommands().
Reduced Distraction in Editor
As previously noted, the Site Editor is undergoing numerous enhancements. One of the notable upgrades involves the implementation of a Distraction-Free Mode. Previously, this mode was exclusively accessible within the page and post editor, designed to facilitate seamless content creation.
However, this functionality is now also available in the Site Editor. When activated, this mode will conceal all side and top panels while disabling the block toolbar. As a result, you can concentrate solely on generating your content without distractions.
With that being mentioned, the upper toolbar is also receiving an enhancement. Instead of taking up additional space, you will now observe it within a unified top panel.
Significant changes for WordPress developers
WordPress 6.3 introduces several changes and performance enhancements for WP developers. Some notable alterations can be observed in this version. Here are a few that require your attention.
Improvements in Image Loading
This marks a highly notable enhancement within WordPress 6.3 release. Introducing the “fetchpriority” attribute set to “high” for images, which serves the purpose of identifying the LCP (Largest Contentful Paint) image.
It is likely within your awareness that LCP represents the metric utilized for gauging the duration a website necessitates to render the most prominent content visible on the screen.
The “fetchpriority” attribute prioritizes the loading of the LCP image before even computing the rest of the layout. In short, it enables faster image loading, a major factor for optimizing page speed.
Another significant enhancement involves automatically managing the lazy loading of images using the “loading” attribute. WordPress 5.5 initially introduced it, and in 6.3, developers resolved all its residual issues. These fixes will enhance the overall performance of your WordPress website.
In WordPress 6.3, the function “wp_get_loading_optimization_attributes()” handles both the “fetchpriority” and “loading” attributes concurrently. Currently, you have the option to utilize both attributes.
- “loading” with a value of “lazy”
- “fetchpriority” with a value of “high”
Implementation of HTML5 “async” and “defer” Attributes
Both “async” and “defer” are attributes in HTML 5. They provide instructions to web browsers to download JavaScript files without interrupting the parsing of the HTML. However, these attributes function in distinct ways.
Scripts designated with the “async” attribute will execute in an asynchronous manner as soon as they are fetched. This prompts the browser to halt HTML parsing momentarily upon the script’s retrieval. Conversely, scripts with the “defer” attribute intend to load only after concluding HTML parsing.
In WordPress 6.3, what changes have been made?
The utilization of the boolean parameter “$in_footer” within the functions “wp_register_script()” or “wp_enqueue_script()” functions to register scripts with the attributes “async” and “defer”. Enhance the parameter via overloading, introducing a novel “$args” array parameter. This enables customizing script loading strategy. By adding the boolean parameter “$in_footer,” you can position the script within the wp_footer function.
For example, to load a script asynchronously without blocking the HTML parsing, you can use the “async” attribute.
You can utilize the following function to load a script with the “async” attribute.
This instruction directs the browser to download the script in the background and execute it as it becomes ready. Nevertheless, this also implies that the script might execute before the DOM is completely loaded, or it could be out of order with other scripts.
To load a script progressively without blocking HTML parsing, while also ensuring its execution after the DOM is ready and in sequence with other scripts, utilize the “defer” attribute.
You can utilize the following function to load a script with the “defer” attribute.
This instruction guides the browser to download the script in the background and execute it only after the complete construction of the DOM. This proves beneficial for scripts relying on the DOM elements or other scripts.
With these modifications, it now becomes possible to avoid situations where a script loads in an unexpected sequence.
Development Mode
In WordPress 6.3, a novel Development Mode has been introduced. The utilization of the novel WP_DEVELOPMENT_MODE constant facilitates the activation of this mode. This specific constant offers a selection among the subsequent options.
- “core” – Indicates that a website serves as a core development environment.
- “plugin” – Used for plugin development.
- “theme” – Used for theme development.
- “all” – This indicates that a website is used for all three types of development.
Encountering an empty string indicates the website isn’t used as a development environment. To verify the present setting of your WP_DEVELOPMENT_MODE, you can refer to the Info panel within the Site Health tool.
An additional option involves utilizing a novel function called “wp_in_development_mode()” to assess whether your website operates in a development mode. The inclusion of the “$mode” parameter further enables the distinction of the specific type of development mode in use. Additionally, it’s important to keep in mind that enabling this development mode might influence certain fundamental aspects of WordPress functionality.
As you can imagine, this development mode isn’t useful in the production environment. Utilize it only in development installations.
Final Thoughts
WordPress has maintained consistency in releasing new updates. WordPress 6.3, anticipated for release in August 2023, will not disappoint. This update aims to enhance the user-friendliness of the Site Editor and bolster performance for developers.
For greater convenience and efficiency, you can always rely on our White Label WordPress Development Solution. We can assist you in crafting impressive WordPress websites that exhibit speed, security, and SEO optimization. Reach out to us.
