WordPress 6.3 marks the second major release of 2023, bringing with it a plethora of notable updates, fresh features, enhancements, and bug fixes that amplify the strength and utility of WordPress. With the changes that are spread across 43 core components, WordPress 6.3 opens new possibilities for the creative expression of designers, creators, and builders.
Within this post, we’ll unveil the highlights of WordPress 6.3 and spotlight the features that deserve your attention following the update.
Let’s take a look!
Designed to elevate your styling capabilities to unprecedented heights, this advanced API empowers you with the ability to configure multiple CSS selectors, ensuring a seamless generation of global styles across your blocks. Notably, this can be achieved across three distinct levels: root, feature, and sub-feature.
- Root Selectors
At the core of the Selectors API lies the root selector, your block’s principal CSS selector. Every block requires a primary CSS selector to orchestrate global style declarations. Should you not designate one through the Block Selectors API, rest assured that a default selector (in the form of .wp-block-) will be generated for you. - Feature-level Selectors
In the new version, API empowers you to target specific block features with unparalleled precision – be it borders, colors, typography, or other attributes. This facet enables you to bestow distinct styles upon various elements within your block. For instance, imagine applying color schemes to your block’s wrapper while refining typographic elements within an inner text element. - Subfeature Selectors
The Subfeature Selectors elevate your styling prowess to unparalleled heights. Now, individual styles associated with block features (e.g., background-color or border-radius) can be expressed through unique selectors. This proves invaluable when aiming to implement diverse styles within a single feature. Consider a scenario where the block’s typography necessitates font family at the wrapper level while specifying distinct text decoration and font size for inner elements.
This exciting feature takes center stage within the post and site editors, granting users swift access through keyboard shortcuts, namely ctrl + k or command + k. It offers two avenues to maximize command utilization: static and dynamic commands.
- Static Commands:
Easily register static commands using the wp.data.dispatch( wp.commands.store ).registerCommand action or the wp.commands.useCommand React hook. With either approach, a command object is provided, equipped with a distinct name, a clear label, an icon, a callback function invoked upon command selection, and potentially, a context. - Dynamic Commands:
Dynamic commands, on the other hand, are enabled via “command loaders.” These prove invaluable when command availability hinges on user-input search terms or certain conditions.
The command palette’s versatility extends to contextual commands, ensuring priority visibility and a seamless user experience. These commands shine in specific contexts, such as navigating the site editor or editing a template. Currently, two key contexts have been implemented:
- Site-editor – While navigating the site editor with the sidebar visible.
- Site-editor-edit – When engaged in editing a document (template, template part, or page) within the site editor.
- And the journey doesn’t end here. As adoption grows, additional contexts will be seamlessly incorporated
To manipulate the command palette’s behavior, it is enriched with a host of selectors and actions through the WordPress Data API. These include:
- Retrieving registered commands and command loaders with selectors like getCommands and getCommandLoader.
- Checking whether the command palette is open via the isOpen selector.
- Programmatic control over opening and closing the command palette using the open and close actions.
The latest WordPress 6.3 update brings exciting enhancements to layout support, marking its graduation from experimental to stable. While the functionality remains consistent, the upgrade comes with a small change: when you’re adding block support for layout in your block.json, the syntax “layout” now replaces “__experimentalLayout.” Although the support for the “__experimentalLayout” syntax will still be retained for a transitional period, we strongly recommend that you seize the opportunity to elevate your custom blocks by transitioning to the rock-solid layout syntax.
- Innovations in CSS Specificity for Enhanced Layouts:
Delving deeper, WordPress v 6.3 redefined CSS specificity for specific layout types. The update impacts the CSS output for margin styles of children within constrained and flow (default) layout containers. Previously, these rules carried a specificity of 0,1,0 for all blocks. Now, they’ve evolved to 0,0,0 for all blocks, complemented by an additional 0,2,0 rule exclusively for the first and last blocks within the container. This refined approach resolves the issue of global margin styles being overridden by layout styles, ensuring your designs truly shine. - Empowering Complex Block Markup with Classnames:
- Building on the foundation laid in WordPress 6.2, the latest version integrated layout classnames into the block inner wrapper. While this aligns with the outer wrapper for most blocks, certain blocks (like the core Cover block) encompass multiple inner containers. With WordPress 6.3, a novel classname graces the inner wrapper of all blocks with layout, amalgamating the block classname with the layout classname.
- Say Hello to the New Grid Layout:
Embrace innovation with the introduction of the all-new grid layout type, underpinned by the power of CSS Grid. This dynamic layout defaults to an auto-fill approach, complete with configurable column widths. For those seeking precise control, the columnCount property within the layout object allows you to establish a fixed number of columns. - Elevated Layout and Spacing in the Post Template Block:
Witness the evolution of the Post Template block. Formerly equipped with custom layout styles limited to “list” or “grid” options, it now embraces expanded layout and block spacing support. This means that the Post Template block is no longer confined to the Query block for controls. Instead, these controls now reside in the dedicated Post Template toolbar, granting you the freedom to effortlessly choose between “list” and “grid” styles, now ingeniously powered by the dynamic grid layout type. - Seamless Spacer Block Alignment with Parent Layouts:
- Spacer blocks now seamlessly integrate with parent layout configurations, taking on the orientation of the parent layout, especially within flex-type layout blocks. While you can still manually set an orientation for Spacer blocks based on parent context, flex layouts grant priority to the flex orientation, ensuring consistent and harmonious designs.
The Social Icons block now offers the option to customize both the “Icon color” and “Icon background color” in WordPress 6.3. Prior to this version, the chosen colors were hardcoded as hex code values within the block, even if you selected a color from the theme palette defined in theme.json.
Now, with WordPress 6.3 release, the Social Icons block embraces CSS classes that seamlessly align with your chosen color values. These classes are an integral part of the WordPress ecosystem, ingeniously generated in harmony with the color palette outlined in your theme.json file. Their structure is straightforward:
has-[color_slug]-color
has-[color_slug]-background-color
It’s essential to note that these empowering classes won’t come into play when a user opts for a custom color. This dynamic integration ensures that your design retains its integrity and aligns seamlessly with your chosen color palette, making WordPress 6.3 the pinnacle of design control and cohesion.
In recognition of the diminishing traffic from Internet Explorer users and WordPress’ discontinuation of support for this outdated browser, certain default themes have taken proactive steps. By removing specific Internet Explorer-oriented scripts and styles, these themes are ensuring that the majority of users can enjoy a smoother and faster browsing journey.
Moreover, these optimizations extend to focus enhancement scripts that were previously tailored for Internet Explorer and older versions of Chrome. With the arrival of WordPress 6.3, themes like Twenty Thirteen and Twenty Fourteen have gracefully evolved, no longer incorporating these scripts in their functions.js files. Additionally, from Twenty Fifteen to Twenty Twenty-One, themes have been fine-tuned to neither enqueue nor print these scripts.
This strategic move not only aligns with modern web standards but also reflects our commitment to delivering a top-tier experience for every user. Embrace these enhancements as we usher in a new era of optimized performance and a richer online encounter.
WordPress 6.3 release brings forth an array of strategic enhancements that redefine how queries are cached within the WordPress ecosystem.
- Elevating Cache Group Dynamics:
Diving into the heart of WordPress 6.3, a paradigm shift in cache group dynamics emerges. Previous versions of WordPress stored query results in cache groups aligned with their corresponding objects. However, the landscape has evolved, and WordPress 6.3 introduces a groundbreaking approach that offers developers unprecedented control and precision.
As the WP_User_Query class joins the cache hierarchy, a dynamic modification unfolds. The introduction of distinct cache groups tailored for queries becomes the cornerstone of this evolution. Developers now hold the reins to specify cache group expiration times, enabling the fine-tuning of cache duration. The innovative wp_cache_flush_group() function stands ready for developers seeking tailored cache clearance.
Flexibility extends even further, granting developers the ability to designate cache groups as non-persistent, if necessary. The newly introduced cache groups encompass:
- post-queries
- term-queries
- comment-queries
- network-queries (global cache group)
- site-queries (global cache group)
- user-queries (global cache group)
For those harnessing persistent object caching, the support of the wp_cache_add_global_groups function (introduced in WP 2.6) is paramount to enable global cache groups. An ever-evolving ecosystem beckons, empowering developers to navigate this cache evolution with precision.
- Unveiling wp_cache_set_last_changed():
As the tapestry of enhancements continues to unfold, the wp_cache_set_last_changed() utility takes center stage. This transformative tool steps forth to update the last changed value within the cache, complementing the existing wp_cache_get_last_changed() function. The core architecture now proudly boasts instances where the last changed value is updated via this new function, furthering a seamless cache management experience. - A Symphony of Action and Strategy:
In tandem with the utility, the wp_cache_set_last_changed action is introduced, offering developers a powerful orchestra of cache management. This action unveils key insights such as cache group specifics, updated and previous values, allowing developers to strategize their cache management with precision. Seamlessly integrated with the newly introduced cache groups and the wp_cache_flush_group() function, developers wield the tools to programmatically cleanse entire cache groups.
By utilizing the WP_DEVELOPMENT_MODE constant, you can tailor your site’s behavior to align precisely with your needs. This constant is especially recommended for all development sites, offering enhanced efficiency and precision in configuration. Currently, WordPress core encompasses only a limited number of use-cases influenced by the development mode. However, it’s important to recognize that this scope is poised for expansion in the times to come. The current emphasis primarily revolves around theme.json caching, paving the way for a broader spectrum of potential applications in the future.
Configuring the development mode for your site is effortlessly achieved by incorporating a WP_DEVELOPMENT_MODE constant definition within your wp-config.php file. The suggested approach for determining the activation of a specific development mode on your WordPress site is through the utilization of the newly introduced function, wp_is_development_mode( $mode ).
WordPress 6.3 introduces notable improvements aimed at enhancing load time performance for content containing images. The impact of these enhancements is particularly evident in the Largest Contentful Paint (LCP) metric, which gauges the time taken from the request initiation until the largest content element within the viewport is rendered.
- Automated fetchpriority Support
WordPress 6.3 latest release, now includes the fetchpriority attribute, set to “high,” within the image tag it identifies as the “LCP image” – the image constituting the largest content within the viewport. This attribute instructs the browser to prioritize this image, boosting LCP performance by approximately 5-10%. For further context, refer to the initial proposal post. - Automated lazy-loading
A series of refinements and resolutions have been introduced to enhance the automatic management of lazy-loading using the loading attribute. This refinement process, initiated in WordPress 5.9 and continued in 6.2, culminates in comprehensive enhancements in WordPress 6.3. This meticulous approach ensures the more accurate identification of images where omission of the attribute is appropriate, thereby contributing to optimized performance. For deeper insights into the significance of not lazy-loading in-viewport images, especially the LCP image, in the context of performance, refer to the relevant WordPress 5.9 dev note post.
WordPress 6.3 introduces a significant improvement to the get_pages()function. It now utilizes WP_Query internally, addressing a 13-year-old ticket (#12821). This update reduces complexity by offloading database queries and cache handling to WP_Query.
As a result, this eliminates redundancy and ensures that all filters within WP_Query apply to get_pages(). Users employing filters like posts_pre_query or posts_results for customized WP_Query behavior, including data retrieval from alternative sources such as cache or other databases, will benefit. Additionally, a new filter named get_pages_query_args has been added, allowing developers to modify parameters passed to WP_Query while maintaining compatibility with original arguments.
PHP Support
WordPress 6.3 no longer provides support for PHP 5.
The minimum supported PHP version has been raised to 7.0.0.
Wrap Up
WordPress 6.3 release represents a significant leap in the editing experience. The improvements are substantial, covering various new editing features in the site editor, a redesigned and versatile block pattern system, new blocks, improved performance, enhanced accessibility, and internationalization enhancements, among other improvements.
If you’re thinking about upgrading your WordPress site to leverage these remarkable advancements, our skilled team of WordPress professionals is here to offer seamless assistance and guidance. Embrace the capabilities of WordPress 6.3 and discover new possibilities for your online presence.
