Store Editing Snaps: Product Display Options, Accessibility, and More

Hello and welcome to another round of Snaps from the WooCommerce Store Editing team! 🎇

Every couple of weeks, we give an update on all the work being done on WooCommerce Blocks from behind the scenes.

Let’s take a look at some highlights of what we’ve done since our last update.

Note that the linked #numbers that accompany each item below point to the relevant issues and pull requests on the GitHub repository.

What We’re Working On 🚧

We’ve worked on a number of things in the last two weeks but here are some specific items we want to highlight.

Product Collection Block

This project aims to create a Product Collection block with the functionality of Products (Beta) block but as an improved experience for displaying your products. It includes foundational work to cover the current Products block functionalities, improvements around Inspector Controls, and a set of basic patterns for a new block.

We’re currently working on new features and further improvements that will allow for even easier store set up.

Product Collection: disable “Sync with current query” option for 2nd+ block in product archive (#44577)

Here, we’ve introduced the logic that the “Sync with current query” option is enabled ONLY IF there’s no other Product Collection block that already syncs with the query. Previously, the option was enabled by default on product archives.

Improve Accessibility in Product Collection Navigation (#44599)

We have introduced improvements to enhance accessibility and user experience of the Product Collection navigation. Specifically, we’ve added new context properties to manage accessibility messages during the navigation process, including messages for loading and when a page has loaded. These changes ensure that screen reader users receive appropriate feedback during navigation.

Store Customization

The goal of this project is to prepare the Customize Your Store (CYS) onboarding flow for usage outside of the context of WooExpress, ensuring all eligible features are available for use in the core of WooCommerce.

Note that this project covers all of the essential features, with the exception of AI.

CYS: Override header and footer template parts (#45196)

Here, we transform the header and footer sections into template parts. This adjustment ensures that any changes applied via the assembler to the header and footer will propagate to other pages, ensuring consistent updates across the entire site.

[CYS] Fetch the activeThemeHasMods right before is used to improve intro loading time (#44647)

In order to help reduce the loading time of the Intro step, we’ve moved fetching the activeThemeHasMods flag to the assembler-hub step (where it’s first used).

Templating logic update

We are making some improvements to the logic that handles WooCommerce templates, those are Product Catalog, Products by Category, Single Product, Cart, Checkout.

The goal of this project is to improve test coverage, modernize the code and, with it, fix some long-standing bugs which affect some edge cases.

Refactor BlockTemplatesController (#44537)

In this PR, we’ve refactored BlockTemplatesController.php with the goal to extract all the logic which is specific to certain templates to their own files.

Now, every template and template part now has its own class, where the slug, title, description and fallback template are defined, as well as any custom logic needed for the template to work.

Other Notable PRs / Issues ✅

• Improve the Compatibility Layer docs to minimise confusion (#44924)
• Update blocks build message (#44811)
• Prevent script caching by using the WC core version to hash Interactivity API assets instead of old WC Blocks version (#44806)

Thanks for following along with us – until next time! 👋