WordPress.org
Get WordPress
WordPress.org

WordPress Developer Blog

What’s new for developers? (July 2023)

By Justin Tadlock
, ,

Today’s edition of What’s new for developers? marks six months of the extender-focused roundup here on the WordPress Developer Blog. So break out the party hats, champagne glasses, and cake. You can’t celebrate without cake.

It couldn’t come at a better time. This is a big post, filled with lots of developer goodies.

Which is what you’d expect—WordPress 6.3 is only a month away. Officially, the launch date is August 8, 2023. There will also be a live product demo on July 20, 2023.

So if you haven’t already, give WordPress 6.3 Beta 3 a spin (6.3 testing instructions). You’ll need it and at least Gutenberg 16.1 to test the latest features.

Speaking of WordPress 6.3, that release will officially drop support for PHP 5. After August 8, you will need to run PHP 7.0.0 or newer to use WordPress.

Table of Contents

Highlights

Phase 3 updates

Gutenberg lead architect Matías Ventura posted four updates on his March 2023 Phase 3: Collaboration outline. 

The four posts will keep you current on the roadmap to what are arguably the biggest changes to the editorial workflow that WordPress has ever seen:

  • Real-Time Collaboration covers plans for concurrent collaboration, shared edits, visibility of peers, and lifting current editing restrictions.
  • Workflows imagines seamless collaboration over the whole editorial process, from first draft through publication and beyond.
  • Revisions proposes a complete overhaul of the current system in favor of one that works with blocks and tracks changes on every data layer, from the server stack to the user’s latest edits.
  • Media Library aims to expand media management capabilities, unify the interfaces and improve overall media workflows.

Throughout the posts, Matías makes it clear that these are early days. Phase 3 is an audacious plan that will change publishing as we know it, and it will need your ideas (and code!) to come to life.

Command Palette

Modal overlay with search/command input in the site editor.

The Command Palette, formerly the Command Center, now has a public API. This means you can extend it to add custom commands in your themes and plugins, or even unregister core commands.

The palette puts commands at your fingertips that control these areas:

Block spacing and CSS-Grid layouts for Post Template

WordPress post editor with a three-column grid of posts.

Gutenberg 16.0 brought a major change to how the layout works for the Query Loop and its nested Post Template block.

Before 16.0, the grid options used the CSS Flexbox module (and its wrap option to lay posts out in columns. 

Now the feature has true CSS-Grid support. To most people, the block doesn’t look all that different. But for you, it opens up the entire CSS-Grid specification for you to use in custom block styles.

As well, now you can control the block spacing between posts in either the list or grid views. Before 16.0, this was a hardcoded value that rarely matched the theme’s spacing rules.

Footnotes block

WordPress post editor with several paragraphs of text and a footnotes section at the bottom. A dropdown with "Footnote" is highlighted in the toolbar.

A new Footnotes block landed in Gutenberg 16.1, letting you insert a footnote link in any RichText area. Once the link is there, it shows you a footnote list at the bottom of the post. There you can edit each footnote’s content.

For the most part, this is a user-facing change, but you can style the block to match your theme. 

Plugins and tools

WordPress development mode

WordPress 6.3 will bring you a WP_DEVELOPMENT_MODE constant, to signify a context-specific development mode, that you can set to core, theme, or plugin. Setting the constant to an empty string will mean you’re not using a development mode..

Plus, a new wp_get_development_mode() function will return the value of the constant.

What’s this mode good for? 

If you’ve ever had theme.json caches disrupt your workflow when you were elbows-deep in a theme, now you can set your development mode to turn off caching programmatically. 

In the future, you might use these modes for clearer error messages—or build your own tooling.

Set async and defer attributes on scripts

Right now, if you want a script to load in the footer, you can do that with a boolean. 
In 6.3, though, you’ll be able to use an array in the $in_footer parameter of wp_register_script() or wp_enqueue_script(). That array will take this form:

array(
	'strategy'  => 'defer', // or 'async'
	'in_footer' => true     // or false
)

Post editor iframe is back

The post editor iframe is back, as of Gutenberg 16.0. Did you miss it? You’ll need to set all your registered blocks to API version 3 in their block.json files. You should probably update those versions anyway—unless, of course, you have a reason for some of your custom blocks to hang back at version 2.

If you were previously using the enqueue_block_editor_assets hook to load CSS or JavaScript that targets the content canvas, it will not work in an iframed editor. See the solution posted in this GitHub comment to update.

Component updates

A new HeadingLevelDropdown component is here, to use in your own blocks. It lets users select headers from H1-H6,  or a paragraph tag. The new component is separate from the Heading block, so you can reuse core code.

The Button component has a new size property you can set to small (24px), compact (32px), or default (36px). The default prop will be 40px when __next40pxDefaultSize is set to true.

The Toolbar component now uses Ariakit, the successor to the previously-used Reakit. You should see better performance and fewer bugs. Your toolbar interactions should behave as they do now, but test your custom blocks.

Check if theme supports the Site Editor

A new is_block_theme property lets you check exactly that in the REST API, courtesy of the wp/v2/themes API response.

Action and filter hooks

Several new hooks will land in WordPress 6.3:

  • plugins_list: Now you can manipulate the list of plugins that show on the Plugins screen.
  • bulk_edit_posts: An action hook that fires after post data is processed but before the results of the bulk edit are returned.
  • wp_update_user_action: An action hook that fires after a user has been updated and emails have been sent.
  • nav_menu_item_attributes: A filter hook for passing attributes to nav menu items.
  • nav_menu_submenu_attributes: A filter hook for passing attributes to sub-menus within a nav menu.

Plus, you’ll have a new parameter, $previous_status, to pass to existing trash hooks— pre_trash_post, wp_trash_post, and trashed_post.

Enhanced performance for first large image

In May, the Performance Team proposed adding the fetchpriority="high" attribute to speed up Largest Contentful Paint images.

A solution has now merged into Core that adds the attribute to the first image on a page that is neither lazy-loaded nor has a conflicting fetchpriority attribute, and has dimensions greater than 50,000 square pixels.

Better block render path detection in watch mode

When the start command is running with @wordpress/wp-scripts, a new webpack plugin handles updating the block render paths defined in block.json. Essentially, it is a more performant way to find changes to the file. The best part? You get the speed improvements by simply using the scripts package—with no extra updates to code or anything.

Bug fixes

The Classic and Shortcode blocks no longer convert HTML entities when they are parsed. This change prevents bugs based on the library used for parsing HTML.

Up to now, you could choose multiple authors in the Query Loop Block. But you’d only get posts from the first one. A recent patch should fix that behavior in WordPress 6.3.

Relevant user interface changes

Now you can edit and create new pages in the Site Editor—just pick Pages in the menu. If your plugins hook into the content creation process, you’ll want to test them for compatibility.

Themes

New source attribute for block patterns

A new source attribute has come to the Block Patterns API that lets themes, plugins, core, and other sources define where the pattern is coming from. If you are registering patterns from a theme, your source attribute should be theme. For plugins, use plugin.

Descriptions for style variations

Global style variations, defined in a theme’s /styles folder, now have a description property for better accessibility. Use it to give screen readers more information on your design; before, all you had was the title.

Classic theme support improvements

Classic themes are getting some love in WordPress 6.3:

Post Content block is back in the post editor! (Sort of)

Gutenberg 15.9 took the Post Content block out of the post editor, because the editor canvas is the content. But that change also meant you could not use the Query Loop block to showcase content from other posts and pages.

In Gutenberg 16.1, the Post Content block is back for the post editor, but you can only use it inside a Query Loop block.

Non-root sticky positioning

A pull request in Gutenberg 16.1 re-enabled sticky positioning on non-root blocks. This is a part of a larger ticket that has several other moving parts to finish before it can be merged.

Tweak return values of gutenberg_get_global_styles()

In WordPress 6.2, the gutenberg_get_global_styles() function returns the CSS value, not the custom property defined in theme.json.

For example, if you wanted to get a font size, the function returns 16px, not var( --wp--preset--font-size--medium ). Depending on what else you were doing, that could have been an unexpected result.

There’s been a change that adds a transforms key that lets you set the data format. For now, it accepts one value in the form of array( 'resolve-variables' ), and you can transform the value to its custom property. You might see more transforms added in the future.

theme.json layout definitions support removed

Layout definitions are gone from theme.json in Gutenberg 16.1. Previously, settings.layout.definitions gave you ways to extend or override some core rules. But that never got any official support. And inclusion has bred some bugs. If you have used these definitions in the past, you’ll want to take them out of your theme.json file.

Note that this does not affect customizing the content and wide sizes in settings.layout.

Textdomain loading is gone from core themes

WordPress has supported just-in-time translation loading since version 4.6, and theme authors haven’t needed to call load_theme_textdomain() since that release. This function call is no longer in any default theme from  Twenty Seventeen on.

Bug fixes

Several bug fixes related to themes landed in Gutenberg and core WordPress in the last month:

Noteworthy user-facing changes

Music streaming platform Anghami is now on the list of trusted oEmbed providers. There is no specific block variation for it yet, but you can still show songs and playlists in the Embed block.

The Global Styles revisions system has moved from the experimental stage and will ship with WordPress 6.3.

Proposals, events, and resources

Proposals

Here are a couple of major proposals that you should read. Please join these discussions—they will affect how you build on top of WordPress for years to come:

Learn WordPress

Two new tutorials and one new course have arrived on Learn WP in the past month:

Hallway Hangouts and Developer Hours

In June, two events showcased best practices for extending the block editor:

Developer Blog

Four new posts went live in the last 30 days:

Props to @bph for co-writing and wrangling these resources and @marybaum for feedback and review.

Categories: , ,
Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *