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 that mirrors the functionality of the Products (Beta) block. The key difference with this block is that it will be built as a standalone/forked block, and not as a variation of the Query Loop block. This will offer us greater flexibility for customization and a better overall user experience for our merchants.
The work here will build the foundation to cover the current Products block functionalities, make improvements to the Inspector Controls, and implement a set of basic patterns for a new block.
Foundation of New Product Collection Block (#9352)
Here, we introduce the foundation for a new Product Collection block. It includes the creation of two new blocks:
- Product Collection
- Product Template
The Product Collection block will eventually replace the existing Products (Beta) block.
Patterns
We’ve continued to work on adding more patterns to make your store layout easier. Some of them are available in the WooCommerce Blocks 10.3.0 version, while a few of them are still work in progress.The current status of each pattern can be viewed in the corresponding pull request.
[Pattern] Add new Hero product chessboard pattern (#9180)
Add new Product listing with gallery pattern (#9347)
Add Product Details: product listing pattern (#9383)
Mini Cart Improvements
In an ongoing effort to improve our existing blocks, we’ve continued to focus on additional updates to our Mini Cart block. This includes more bug fixes and additional improvements to the internals of the Mini Cart.
Only show the Mini Cart count badge when there are items in the cart (#9259)
We have modernized the Mini-Cart block count badge. Now, it’s displayed with the inverted colors from the rest of the button and is hidden when there are no products in the cart.
Add color and typography styles on the mini cart title block (#9382)
The Mini-Cart Title block now has support for color and typography styles! Thanks to Danilo Parra Jr, who contributed this enhancement.
Update Mini-Cart block editor sidebar (#9420)
We also introduced some enhancements to the Mini-Cart block editor sidebar, improving the texts, adding an image to the template part link and rearranging some options. This makes the Mini-Cart block easier to interact with and will help pave the way for introducing new features in the future.
Make Mini-Cart block work well with caching plugins (#9493)
One feature that has been requested for a long time was to make the Mini-Cart block compatible with cache plugins. We are happy to announce that it will be, starting from the next release of WC Blocks!
Fewer dependencies
In addition to everything that has been announced, we have reduced the number of dependencies which are needed in the frontend of the Mini-Cart block when opening the drawer: #9251 and #9345. This makes the Mini-Cart block faster and requires less resources.
Blockifying templates
The goal for this project is to continue our effort to create a complete block experience for all of the Product templates. This will allow merchants to use the features of the Site Editor to create and edit the template used for rendering all single products (or even a specific product). We will also continue to leverage the work that has been done on the “Products (Beta)” block and create equivalent blocks for the various parts of an archive page.
Enable blockified templates (#9551)
On new installations, WooCommerce 7.9 will have the blockified templates by default.
Add to Cart Button: enable usage for the Single Product Block and update block registration (#9404)
We enabled the the Add to Cart button block for usage within the Single Product Block (originally, this button was only available in the main Products loop). As part of this work, the block registration was also updated to rely on the `block.json` metadata file for improved performance.
Product Rating block: Add Single Product template support to the block (#9499)
We worked on the Product Rating block to be used in the blockified Single Product template.
Additionally, we’ve made some enhancements to the blocks related to the blockified templates:
Styles
- Add to Cart with Options: Fix styles that are not being applied correctly (#9472)
- Product Meta block: Remove the fill color of the icon and move it to the Icons library (#9506)
- Product Details block: Remove the fill color of the Product Details icon and move it to the icons library (#9503)
Bug fixes
- Product Archive Template: Fix compatibility Layer with Product Recommendations extension (#9452)
- Fix Product SKU not being displayed on frontend (#9446)
- Fix Product Rating Block not showing when manually inserted to Single Product Block (#9413)
- Product Archive Template: Fix compatibility Layer with Product Recommendations extension (#9452)
- Product Rating block: Refactor the block to use useIsDescendentOfSingleProductBlock hook (#9489)
Gutenberg Contributions
In order to support our ongoing projects and contribute to the broader community, we have also made upstream contributions to the core Gutenberg project.
- Adjust the logic of Post Title edit, so it avoids unnecessary options requests (#49839)
WooCommerce Blocks Releases ✨
10.2.0 – Many of the changes noted in this post are included in the 10.2.0 release of the WooCommerce Blocks feature plugin from May 11th. You can find the full details in the release notes.
Thanks for following along with us – until next time! 👋
Leave a Reply