Page creation patterns in WordPress 6.0

When a user creates a page, the editor starts with an empty canvas. However, that experience may not be ideal, especially since there are often possible patterns the user can use when creating a page, e.g., an about page, a contact page, a team page, etc.

Starting with WordPress 6.0, offering a set of patterns that users can choose from to create their pages is possible. We added a modal that shows possible patterns that can be used on page creation:

The modal appears each time the user creates a new page when there are patterns on their website that declare support for the core/post-content blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. types. By default, WordPress 6.0 CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. does not include any of these patterns, so the modal will not appear without some of these post content patterns being added.

Any theme or pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party can register a pattern with core/post-content block support and make the modal with the patterns appear. Here we provide a sample pattern that appears in this model.

register_block_pattern(
	'my-plugin/about-page',
	array(
		'title'      => __( 'About page', 'my-plugin' ),
		'blockTypes' => array( 'core/post-content' ),
		'content'    => '<!-- wp:paragraph {"backgroundColor":"black","textColor":"white"} -->
		<p class="has-white-color has-black-background-color has-text-color has-background">Write you about page here, feel free to use any block</p>
		<!-- /wp:paragraph -->',
	)
);

To register the page patterns via the theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. file added the Body Types section to the php stub:

<?php
 /**
  * Title: Hello
  * Slug: my-theme/hello
  * Block Types: core/post-content
  * Categories: featured, text
  */
?>
<!-- wp:heading -->
  <h2>Hello</h2>
<!-- /wp:heading -->

More details on the auto-detection of patterns via .php files, are available in this Dev Notedev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase.: New features for working with patterns and themes in WordPress 6.0

Completely disabling this functionality

By default, no modal appears because there are no post-content patterns unless a theme or plugin registers one.
If one wants to disable the modal even if there are plugins registering post-content patterns, it is possible to do so by removing the post-content block type from all patterns, as the following code sample does:

$patterns = WP_Block_Patterns_Registry::get_instance()->get_all_registered();
foreach ( $patterns as $pattern ) {
	if (
		! empty($pattern['blockTypes'] ) &&
		in_array('core/post-content', $pattern['blockTypes'] )
	) {
		unregister_block_pattern( $pattern['name'] );
		$pattern['blockTypes'] = array_diff( $pattern['blockTypes'], array( 'core/post-content' ) );
		register_block_pattern( $pattern['name'], $pattern );
	}
}

For more info see #40034.

#6-0, #dev-notes, #dev-notes-6-0

Proposal to Start a News blog on developer.WordPress.org

Staying on top of the new features coming to the WordPress open-source project is one of the main barriers expressed by developers.

The Make CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. blogblog (versus network, site) has a heavy emphasis on meeting notes for the various core teams, rather than highlighting new features. This makes it difficult for developers who are not contributors or who just occasionally contribute to find the relevant information among the team-related posts. 

To achieve one of the big-picture goals for 2022 (“Create a developer-focused communications site“), this is a proposal for creating a Developer News blog. The content focuses on updates for developers, extenders creating plugins and themes, and those who work with WordPress at an agency or as freelancers. 

Preliminary Timeline

  • Proposal and request for comment period: February 25 – March 18, 2022
  • Coordinate with Design and MetaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. Teams for theme (the News theme would be spectacular) 
  • Brainstorm meeting with team representatives: End of March
  • Content creation and first post: early April 2022 
  • Start-up phase: Through mid-July
  • Review and expansion to regular topics for developers: Fall 2022

Problem to be Solved 

The current developer.wordpress.org holds a ton of comprehensive documentation with examples, tutorials, getting started guides, and more. That being said, there are various improvements that could be made to make the site much more impactful. Some of these areas for improvement are outlined below. 

What’s missing: 

  • There is no changelog to signal various changes including when pages are updated or when new APIs appear or existing ones are augmented with new filters, hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same., and configuration. 
  • There is no mechanism to subscribe to updates. A blog would provide this feature. 
  • Outside #core-editor meetings and GitHubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/, there is no single place to keep up with  ongoing discussions. For example, to learn about the new styling engine, a developer needs to visit three sites: Discussion, Tracking Issues, and the first PR.

Start-Up Phase

As a first step, the Developer News can tackle the above pain points by:

  • Surfacing updates to documentation, 
  • Highlighting new tutorials, and, 
  • Providing a way for developers to subscribe to stay up to date 

The Developer News blog can also be added to the Planet WordPress feed, so post titles also appear in the WordPress News WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. in the WP Adminadmin (and super admin) Dashboard. 

This initiative requires cross-team collaboration among contributors from the Documentation, Core (core-css, core-js, core-editor etc.), Training, and Support teams. 

These teams could use an existing WP SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel for synchronous meetings, such as #docs or #core. During the meeting, team reps and other contributors can make editorial suggestions for topics and links that could be included in the next edition of an update post.

An editorial calendar can be an early agenda item for the meetings. 

After the initial start-up phase, the blog would be extended to regular topical posts relevant to developers. 

Possible Ideas for Future Expansion

  • Summaries from GitHub Discussions 
  • Excerpts from meeting discussions for distribution to a wider audience of developers
  • A post consisting of a summary of multiple dev updates 
  • Useful questions/solutions found on StackOverflow/StackExchange 
  • Reviews of existing documentation to identify gaps 

A possible future expansion would include a regular revision process to update content with new information and changelog recording. 

I recommend that contributors to this initiative comply with the Make Core Post and Comment Guidelines. Should the editorial group decide to also include highlights of example plugins or themes, all products must adhere to the Community Team’s guidelines regarding GPLGPL GNU General Public License. Also see copyright license. compliance of the products, including premium products. 

As mentioned above, these are just some initial steps to get processes and contributors in place. Reader comments and discussion in the Slack channel will surface opportunities for further enhancements. 

What do you think? How could this proposal be improved?
Please share  your comments, your thoughts, and content ideas. If you’d like to contribute to the Developer News, mention this also in the comments. The comment period on this proposal will end on March 18, 2022. 

Props to Dion Hulse (@dd32), Destiny Fox Kanno (@piyopiyofox), Tara King (@sparklinerobots), Anne McCarthy (@annezazu), Tonya Mork (@hellofromtonya), Daisy Olsen (@daisyo), Dan Soschin (@dansoschin), and Anjana Vasan (@anjanavasan) for fruitful collaborating on this proposal. 
Props to Mary Baum (@marybaum) and Jean-Baptist Audras (@audrasjb) for final review

#developer-news, #proposal

Exploration to enable better Developer and Visitor Experiences with blocks

In this post, we are using the following terms:

Visitor Experience: to refer to the UXUX User experience of a final user visiting a WordPress site.
Editor Experience: to refer to the UX of a user in the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor.
Block Developer Experience: to refer to the experience developers have when working to create blocks.

Blocks have been a huge improvement for the Editor Experience. Now, editors can create complex content and customize their site designs with the same technique: by using blocks. But from a development perspective, there’s still room for improvement with regard to the level of interactivity that can be enabled with blocks for the visitors of a WordPress site (Visitor Experience) and the Development Experience of creating blocks. 

The general acceptance of blocks as the new WordPress data abstraction is the perfect moment to provide a standard solution to create interactive blocks. 

Wouldn’t it be nice (🎶) if we could…

  • Enable a much more powerful interactive and dynamic Visitor Experience with blocks? 
  • Have a much more delightful Developer Experience when building blocks? 
  • Offer a standard way to create interactive blocks so block developers don’t have to reinvent the wheel? 
  • Ensure the block editor takes care of performance optimizations for visitors?
  • Enable nice and faster page transitions with blocks? 

This post aims to start a conversation about these challenges and highlight them as some of the problems that need to be solved in order to achieve one of the big-picture goals for 2022: To improve the Block Developer Experience.

Table of Contents

A better interactive and dynamic Visitor Experience with blocks

What does it mean, to have better interactive and dynamic Visitor Experiences with blocks? Let’s take some use cases as examples of things that would be great if they could  be done just with blocks. Imagine (🎶) :

  • A form block that doesn’t trigger a page reload to display responses from the server. 
  • A pagination block that doesn’t reload the whole page when going to “next page” and loads only the portion needed.
  • A learning management system (LMS) where users can interact with the content in a more dynamic way enabling a better learning experience
  • Create with blocks a great e-commerce experience with carts, checkouts, and product galleries that dynamically respond to the visitor interaction
  • The ability to create just with blocks things such as Infinite Scroll, Swipe Navigation or any other experience in the frontend you can imagine.

Let’s work together to enable these kinds of delightful Visitor Experiences by using blocks!

By working together we can create  a standard way to develop blocks that enable complex and performant visitor experiences (perhaps by taking advantage of techniques such as frontend block hydration). 

A better Block Developer Experience

Blocks are amazing. They are a great mechanism for writing content. And now, with Full Site Editing, the power of Blocks has reached the world of Themes, so you don’t need to know how to code to create and customize your WordPress site. 

There are still challenges to solve though regarding the Block Developer Experience (“better block deprecation management” or “avoid duplication of code across JavascriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com/. and PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher in order to properly render a block” are some examples of things that could be improved). It would be great if blocks could enable great Visitor experiences whilst also taking care of the complexity of modern tooling and strategies.

Let’s work together to define a standard way to create blocks that makes the development of blocks a pleasant experience.  

Get involved! 

Please share your thoughts, feedback, or ideas in the comments of this post or in the Developer Experience category of Github Discussions of the Gutenberg repo. There are already some conversations started by contributors there.

We’d love to hear your ideas regarding this:

  • Do you have some exploration you’d like to share with the community? 
  • How do you think blocks could enable more powerful Visitor Experiences? 
  • Is there any specific Visitor Experience (transitions between pages, partial hydration,…) that cannot be (easily) done with blocks that you think is missing? 
  • How do you think the Block Development Experience could be improved? 
  • What are the most important aspects of Block Development Experience you would like to improve?

Thank you (🎶) to @luisherranz, @priethor, @bph, @annezazu, @poliuk, @matweb, @mburridge for reviewing and helping shape this post!

#block-developer-experience, #visitor-experience

Dev Chat Agenda, May 11, 2022

With RC2 and waiting for some posts, this agenda is being published on May 11. Updated in item 4 with the RC3 date and next major bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. scrub.

The weekly WordPress developers chat takes place in the #core SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel of Making WordPress at 20:00 UTC

Summary from Dev Chat on May 5, 2022 – thanks to @webcommsat for the notes. Who can do notes for the meeting on May 11?

2. Announcements

WordPress 6.0 RC2 is available for testing (released May 10, 2022).

Gutenberg 13.2 has landed!

3. Blogblog (versus network, site) posts of note to coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.

A Week in Core – May 9, 2022 (published May 11, 2022)

Performance Team Meeting Summary, May 10, 2022 – includes some updates on WebP, some POCs needed for the Site Health and Measurement sub groups. At the end of the post, there is a list of areas where help is needed.

Open floor item in the Editor Chat agenda for May 11, 2022 on a discussion around adding a new label to the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ repo around issues that impact adoption. The aim would be to have an easier way to see, at a glance, what big issues are impacting the adoption of Gutenberg.

Full Site Editing Program Testing Call 14 – Rallying Recipe Reviewers. Deadline for feedback: 18 May 2022

Early 6.1 scrub schedule: Mondays at 18:00 from @costdev

4. Upcoming releases

Next major: WordPress 6.0

Updates from Release Co-coordinators and members of the squad.

6.0 RCrelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). 3 Release Party on May 17, 2022 – meet in the #core Slack channel. As always with releases, there’s a chance this time may change the day of depending on how things are progressing. The time will be communicated across channels (#core-editor#6-0-release-leads, and in #core). All welcome.

The next major bug scrub before RC3 will be on Thursday May 12, 2022, 21:00 PM UTC. The full bug scrub schedule for 6.0

5. Open Floor

If you are a component maintainer or running a bug scrub and have any updates not already mentioned under 6.0 updates, you can raise them in this section too.

#agenda, #dev-chat

Early Bug Scrub Schedule for 6.1

As work begins on 6.1, it’s time to schedule some early 6.1 bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. scrub sessions.

These scrubs will happen once a week, usually scheduled for Thursdays at 18:00 UTC, though there may be some adjustments to accommodate releases, as well as religious and national holidays.

Right now, this only includes Early Scrubs. A release schedule for Alpha, BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process., and Release Candidaterelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). scrubs will follow soon.

Early Scrubs:

Focus: early tickets milestoned for 6.1, tickets that require more time or early testing.

Hosted by @costdev

Hosted by @audrasjb

Starting from Thursday, 23 June 2022, 20:00 UTC, @audrasjb will be hosting recurring 6.1 bug scrubs every Thursday at 20:00 UTC.

Check this schedule often, as it will change to reflect the latest information.

What about recurring component scrubs and triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. sessions?

For your reference, here are some of the recurring sessions:

Have a recurring component scrub or triage session?
PingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” @costdev on SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. to have it added to this page.

Want to lead an Early Bug Scrub?

Did you know that anyone can lead a bug scrub at any time? Yes, you can!

How? Ping @costdev on Slack with the day and time you’re considering as well as the report or tickets you want to scrub.

Your scrub can be added it to the schedule here. You’ll get well deserved props in Dev Chat, as well as in the #props Slack channel!

Need a refresher on bug scrubs? Checkout Leading Bug Scrubs in the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. handbook.

Questions?

Have a question, concern, or suggestion? Want to lead a bug scrub? Please leave a comment or reach out directly to @costdev on Slack.

Props to: @hellofromtonya for proof-reading.

#bug-scrub, #core

Editor Chat Agenda: 11 May 2022

Facilitator and notetaker: @paaljoachim

This is the agenda for the weekly editor chat scheduled for Wednesday, May 11 2022, 04:00 PM GMT+1. This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have an update for the main site editing projects, please feel free to share as a comment or come prepared for the meeting itself.
  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meeting

WordPress 6.0 Field Guide


Update on 5 May 2022: Updates to the @wordpress/create-block templating system and Block Locking Settings in WordPress 6.0 dev notesdev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. were added to the BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. Editor section.


With the Release Candidaterelease candidate One of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). 1 officially shipped, it’s time to explore the next major releasemajor release A release, identified by the first two numbers (3.6), which is the focus of a full release cycle and feature development. WordPress uses decimaling count for major release versions, so 2.8, 2.9, 3.0, and 3.1 are sequential and comparable in scope., WordPress 6.0. This release introduces Style variations, the Block Locking UIUI User interface, various writing improvements, more design tools, new hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same., updated external libraries, and more! At a high level, there are 97 enhancements and feature requests131 bug fixes and 13 Gutenberg bug fixes23 other blessed tasks, which brings us to 251 Trac tickets in total.

The new performance team has been working hard to improve various parts of WordPress. A lot of queries have been optimized and some removed, cache improved, multiple translations of the same strings removed, just to mention a few.

Let’s take a deeper look at what to expect in 6.0.

Note: Note: some of the changes will require pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-partyPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party and theme authors to adapt or change their code. Please, read these Dev notesdev notedev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. Each important change in WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blogblog (versus network, site) during the betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field GuideField guide The field guide is a type of blogpost published on Make/Core during the release candidate phase of the WordPress release cycle. The field guide generally lists all the dev notes published during the beta cycle. This guide is linked in the about page of the corresponding version of WordPress, in the release post and in the HelpHub version page. at the beginning of the release candidate phase. carefully to make sure your code is ready for WordPress 6.0 on May 24, 2022.

Accessibility

Along with performance, lots of work has focused on improving accessibility in various parts of the WordPress software.

Block Editor

The Block Editor updates bring new functionality, fixes, and more:

  • The ability to bundle multiple Style variations for block themes.
  • The option to create page content patterns that users can choose from to create their pages.
  • New ancestor property in block.json letting one restrict where users can place their blocks.
  • A new block locking UI with a lock attribute for every block.
  • Registration of blocks from within themes.
  • Improved support for preserving unrecognized content in the editor.
  • More robust block theme export feature in the Site Editor.
  • Block markup updates for image, quote, list, and group blocks.
  • New set of Post Comments blocks, No Results block, and more.
  • & more!

Of note, if you currently have the Gutenberg plugin active on your website and are upgrading to WordPress 6.0, please make sure Gutenberg is updated to its latest version. This helps ensure the best experience possible.

Let’s dig in.

Bootstrap/Load

Amongst other performance improvements, in this release you’ll be able to skip not needed queries with do_parse_request filter.

Cache API

In WordPress 6.0 wp_cache_*_multiple API becomes a full CRUD. Also, option to flush the runtime cache without flushing the entire persistent cache is being enabled.

Media

Media has new filters and a few UI additions:

  • Enable edits to custom image sizes. Adds a filter edit_custom_thumbnail_sizes to allow users to enable editing individual custom image sizes. (#28277)
  •  Add a “Copy URL to clipboard” function to the list table view. (#54426)

We’ll find performance improvements in Media component as well.

Posts, Post types/Taxonomies

WordPress 6.0 introduces more dynamic hooks for custom post types and taxonomies.

Taxonomy

Taxonomies received a lot of performance improvements, from term query caching and adding limits to taxonomy queries, through navigation menu items to changing term_exists to use get_terms().

Themes

This new release offers a streamlined way for theme authors to work with patterns, support for multiple theme.json files AKA style variations, better export themes with Site Editor, and a few more goodies.

Allow block themes to be activated without index.php

This change removes the requirement for block themes to have an unused index.php template just for activation, as they use a templates/index.html file instead. (#54272)

Correct the logic for displaying a _doing_it_wrong() notice for add_theme_support( ‘html5’ )

  • Calling add_theme_support( 'html5' ) without passing an array of supported types should throw a _doing_it_wrong() notice: “You need to pass an array of types”.
  • If the second parameter is not specified, it should fall back to an array of comment-listcomment-form, and search-form for backward compatibility.
  • If the second parameter is not an array, the function should return false.

For more info see #51657.

Users

With 6.0 WordPress installs with more than 10,000 users, so called “large sites”, will receive performance improvements for querying and counting users.

Other Developer Updates

WordPress 6.0 also brings:

  • Option for plugin authors to edit plugin description on the Plugins > Add New and/or Network Admin > Plugins > Add New screens.
  • Ability to filter whole notification email in retrieve_password.
  • Possibility to remove site icons in multisite networks.

But Wait, There is More!

More than 131 bugs, 97 enhancements and feature requests, and 23 blessed tasks have been marked as fixed in WordPress 6.0.

Here are a few that haven’t been highlighted:

  • Administration: Add a media_date_column_time filter to the media list table date column. Similar to the existing post_date_column_time filter in the posts list table, this change adds a new hook to filter the “Date” column output in the media list view. (#42942)
  • Build: Update webpack to v5.x. This aligns closer with how the Gutenberg plugin handles WordPress packages. Enable React Fast Refresh support to WordPress core for block development with @wordpress/scripts. Bring caniuse-lite to the latest version which ensures that build tools target the most recent version of browsers supported by WordPress. (#51750, see #55505)
  • Build/Test Tools:
    • A .git-blame-ignore-revs file has been added to the repository with a curated list of “pinking shear” commits (ones only applying stylistic changes), making the blame feature on GitHub much more useful (#55422)
    • Webpack and all related build processes/scripts have been updated to version 5 (#51750).
    • The npm install command has been fixed for contributors using an Apple M series silicone by updating the grunt-contrib-qunit dev dependency (#52690).
  • Bundled Theme: If you’ve been having problems with order of elements in comment form in Twenty Nineteen theme, there’s a good news for you in #46600. It’s fixed!
  • Canonical: Function redirect_guess_404_permalink() includes all public statuses, rather than just publish, in 404 redirects in its search. (#47911)
  • Comments: Speeding up Dashboard and Comment moderation SQL load – (#19901)
  • Emoji: Update the Twemoji to version 14.0.2. This version introduces support for the latest Emoji added in Emoji 14. (#55395)
  • External Libraries:
  • Formatting:
    • Add support for formatting sizes as PB, EB, ZB, and YB. (#40875)
    • KSES: Add support for <ruby> and related elements. This is especially commonly used in Japanese content, but it can also been seen in content of other languages like Chinese. The set of elements to enable such functionality consists of <ruby><rt>, and <rp> in the HTML Standard, while some browsers (like Firefox) additionally support <rb> and <rtc> for more advanced formatting. (#54698)
    • KSES: Allow langxml:langdir attributes globally. Globally permit the langxml:lang, and dir attributes on all elements rather than a subset in accordance with the HTML specification. (#54699)
    • Function get_the_author_link() is going to be pluggable in WordPress 6.0. A new filter, get_the_author_link, is added for altering author link output. (#51859)
  • I18n:
    • List item separator should be a WP_Locale property (#39733)
    • Allow languages path in register_block_type (#54797)
  • Media:
    • Remove attachment_fields_to_save filter and deprecate image_attachment_fields_to_save(). This filter prevented removing attachment titles. This changeset removes the filter and deprecates the related function since it is no longer used. (#39108)
    • Enable edits to custom image sizes. With a new filter edit_custom_thumbnail_sizes users will be able to apply media edits to individual custom image sizes. (#28277)
  • Network/Sites: Improve cache key generation in WP_Site_Query (#55462)
  • Plugins:
    • Introduce the plugin_install_description filter. This allows for modification of the plugin card description on the Add Plugins screen. (#55480)
    • Convert apply_filters() into a proper variadic function. (#53218)
  • Posts, Post Types: Pass the $update parameter to wp_insert_post_data and wp_insert_attachment_data filters. This makes it easier to determine in a callback function whether this is an existing post being updated or not. (#46228)
  • Posts, Post Types; Taxonomy: Translate default labels once. Improve the translation of post type and taxonomy labels by caching the translations during runtime. (#26746)

Please, test your code. You can use the Beta Tester plugin on a test site to validate how your plugin or theme functions with WordPress 6.0 RC1.  Fixing issues that your code has with WordPress core helps you and millions of WordPress sites.

Props to @desrosj, @imath, @spacedmonkey, @swissspidy, @annezazu, @webcommsat, @jeffpaul, @costdev, @bph for contributing to this guide.

#6-0, #dev-notes-6-0, #field-guide

WordPress 6.0 Accessibility Improvements

Thank you to @joedolson and @alexstine for collaborating on this post. 

Improving accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) requires ongoing effort and this post seeks to highlight some of the ways in which the project has taken action in this area of work for WordPress 6.0, set to release May 24th, 2022. If you’re interested in helping with this work, please join the #accessibility channel in Make SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. and check out how you can get involved. There’s plenty of important work to be done including testing, giving accessibility feedback, and creating PRs to address feedback. 

General improvements

Some improvements didn’t fit nicely into a specific area and instead impacted the general experience of using WordPress. This includes everything from adding button text labels to the site editor to displaying the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. title when removing a block:

Navigation block

While the first version of the navigation block that landed in 5.9 ensured many key accessibility features from the start, more work has been done to refine the experience and to ensure changes to the UIUI User interface continue to include accessibility features: 

Block improvements

Beyond the navigation block, various additional blocks received updates to improve their respective accessibility, wherever they are used: 

List View

List View continues to be an important tool, especially in a full site editing world, allowing folks to quickly navigate between complex content. In this release, tons of work was done to allow it to be more high impact for more people:

Media 

Expect various aspects of managing media to have updates from adding a “Copy URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org to clipboard” option to make it simpler to get the URL you need to ensuring the full permalink for an image is visible when on mobile devices. 

Quick/Bulk Edit

Quick/Bulk editing has a few improvements that significantly improve keyboard and screen reader operability:

Login and Registration

The login and registration fields now properly set valid autocomplete attributes with a fix to the generate password button that was misleading: 

Themes

A few fixes are in place for various default themes and the overall process of hovering over theme details now has more consistency: 

#6-0, #accessibility, #dev-notes

#dev-notes-6-0

Block markup updates for image, quote, list and group blocks

Image blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. alignments

Historically, the image block with left, right or center alignments used to have an extra div wrapper around the figure tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) to help with alignment styling.

<div class="wp-block-image alignleft"><figure><img src="someimage.jpg" alt="" width="100" height="100"/></figure></div>

In WordPress 6.0, for themes that support the layout feature, this wrapper has been removed. The markup becomes:

<figure class="wp-block-image alignleft"><img src="someimage.jpg" alt="" width="100" height="100"/></figure>

The new markup/behavior for alignment classes is consistent regardless of the block and regardless of the chosen alignment.

To minimize the impact of this change on the websites, this change is only effective for themes with a theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. file. These themes do support the “layout” feature which automatically provides the right styles for this new markup.

Quotes and lists

The blockquote, ul and ol tag names all now come with a default value for `box-sizing` equal to `border-box`. This change has been made as a bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fix for quote and list blocks using background colors or padding.

Group block stack variation

The new Stack block is a variation of the Group block, and can be thought of as a vertical variant of the Row block. It’s a flex container, meaning it has access to content justifications and block spacing. If combined with the Row block and its ability to optionally wrap onto new lines, it can enable basic responsive behaviors, such as two columns that stack to a single column on smaller displays.

Removal of data-align div wrappers

In the editor and to support/style block alignments, the editor used to add wrapper divs to any block that had an alignment applied to it.
For themes that support the layout feature (with theme.json file), the div wrapper with the `data-align` attribute has been removed. The markup now matches exactly the frontend output.

#6-0, #dev-notes, #dev-notes-6-0

New features for working with patterns and themes in WordPress 6.0

WordPress 6.0 brings three new features to Themes to offer site owners patterns. Register selected patterns from the public pattern directory, add theme patterns to a separate folder /patterns, and add patterns that can be offered to use when creating a new page. 

Pattern registration from Pattern Directory for themes

With WordPress 6.0 themes can easily register patterns from Pattern Directory through theme.json. To accomplish this, themes should use the new patterns top level key in theme.json.

Within this field, themes can list patterns to register from Pattern Directory. The patterns field is an array of pattern slugs from the Pattern Directory. Pattern slugs can be extracted by the url in single pattern view at the Pattern Directory. 

Example: This url https://wordpress.org/patterns/pattern/partner-logos the slug is partner-logos.

{
    "version": 2,
    "patterns": [ "short-text-surrounded-by-round-images", "partner-logos" ]
}

Noting that this field requires using the version 2 of theme.json.

The content creator will then find the respective Pattern in the inserter “Patterns” tab in the categories that match the categories from the Pattern Directory.

Place Patterns in the subfolder /patterns of your theme

Themes can now define blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. patterns as files in the /patterns folder:

devnotes-patterns-directory

Each pattern file consists of a set of pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party-style headers followed by the pattern’s actual source:

<?php
 /**
  * Title: Hello
  * Slug: my-theme/hello
  * Categories: featured, text
  */
?>
<!-- wp:heading -->
  <h2>Hello</h2>
<!-- /wp:heading -->

Motivation

While all themes benefit from this APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways., it is especially convenient for block themes, where conventional folders like templates, template-parts and now patterns reduce the role of functions.php as a control structure. This API also paves the way for any future theme-editing tools that integrate with the block editor.

Note that this is not a breaking change. Much like plugins, themes have been able to register block patterns since the introduction of register_block_pattern() in WordPress 5.5, and that interface is not expected to change.

Observations

  • For now, the only format supported for these files is PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher. While a simpler HTMLHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. format has been considered, PHP offers theme developers an escape hatch, should the pattern have any special content that dynamic blocks haven’t yet absorbed. For instance:
<img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/hello.png">
  • As a general reminder, these PHP blocks are only run upon loading the block editor in order to compute the patterns. Once inserted into a post, patterns are static.

Supported fields

  • Title (required) (implicitly translatable)
  • Slug (required)
  • Description (implicitly translatable)
  • Viewport Width
  • Categories (comma-separated values)
  • Keywords (comma-separated values)
  • Block Types (comma-separated values)
  • Inserter (yes/no)

Props to @ntsekouras.

#6-0, #dev-notes, #dev-notes-6-0