Extending the Future: A Dialogue on WooCommerce Extensibility


At WooCommerce, we thrive on feedback. We understand that our success is intricately tied to the success of those who build with our platform, among them, our Woo Expert partner agencies like Maksimer, Krokedil, Atomic Smash, Neuralab, Built Mighty, and Angry Creative. These agencies recently shared expertise and insights on the transition to a block-based framework. Their feedback has provided us with an opportunity to address specific concerns, as well as reiterate our commitment to the flexibility and extensibility of WooCommerce core.

Upholding Extensibility: Our Commitment

WooCommerce’s flexibility and extensibility has been one of its primary strengths and is a big contributor to its success. This fundamental aspect of WooCommerce will always remain intact, however the interfaces providing that extensibility are shifting.

As a plugin for WordPress, WooCommerce is influenced by the changes to the WordPress project. In turn, the WooCommerce plugin does have influence on the shape of those changes. WordPress has had some fairly significant shifts in its technical architecture with the advent of Gutenberg and more client heavy interfaces. This work helps position WordPress to meet the needs of the current creator economy and improve the coverage of the goal to democratize publishing. 

Similarly, the WooCommerce platform is adopting and maximizing the opportunity for these changes from WordPress to democratize commerce. That doesn’t mean that Woo will be less flexible, or extensible. While striving to always provide a pathway to full backward compatibility, the platform is also transitioning to utilize new extensibility patterns that enable richer and more flexible experiences for merchants, stores, and those building on top of Woo to provide those experiences.

Navigating Challenges: A Collaborative Approach

In the spirit of fostering open dialogue, several WooCommerce engineering leads met with the above-mentioned agencies and their technical leads to discuss the feedback they presented to us. This allowed us the opportunity to compile this document, which addresses some specific  challenges and concerns they face in their day-to-day interactions with WooCommerce. 

Product Loop Challenges

Working with the woocommerce_blocks_product_grid_item_html filter

The product loop is a common place where programmatic customizations are made. One of the most common interfaces used is the woocommerce_blocks_product_grid_item_html filter. The example we received was one where a plugin adds a specific brand to the product via a callback provided to this filter. Another customization adds some custom data to the products in the loop using that same filter. 

Response: Although this filter will not be utilized within the Product Collection block (the replacement for the “product loop”), we are currently working internally on blockifying another extension that heavily customizes product loop views. Having our internal teams go through this process will help inform some guided paths forward for programmatic customizations of this type. In the meantime, there are some options available out of the box with WordPresss that should help achieve the above use case:

  •  (upcoming) Block Hooks in WordPress 6.4 for programmatically auto-inserting blocks in content.
  • Utilize various filters included in the render_block function for low level manipulation at the block level (this combined with the in progress HTML_API in WordPress will allow for some really low-level customizations.)
  • Creating custom blocks for content. Incidentally, combined with the work we’re doing in the product editor, this will allow for product adjacent data flow.
  • The Custom Fields work happening in WordPress right now will also unlock additional flexibility/customizability for inline token type data in content.

Working with product badges

The “On sale” badge is often modified. One example provided is that this badge might state the percentage off of the sale item using the woocommerce_blocks_product_grid_item_html mentioned previously. 

Response: Our recommendation is to approach these customizations using the new Product Collection Block. Once we reach more granularity with this block, you will be able to customize things like badges, images, and more at the block level, rather than having to parse the entire HTML structure.

Cart and Checkout Challenges

Agencies regularly integrate customized outputs for individual line items in the cart and checkout space, and also leverage third-party extensions that create additional outputs.

Below are some example additions or modifications to the Cart and Checkout Blocks, and how WooCommerce is tackling those use cases. 

Adding custom per-item content on the Cart/Checkout item summaries.

Developers want to add custom data per order line, like stock in physical store / stock on web or information per cart item line about shipping limitations. 

Response: The team will be working to add functionally which will streamline the process of adding the data and allow it to be set at render time. You can learn more about this project in our Custom content on the Cart and Checkout summaries roadmap page.

Additionally, we recently published a call for feedback in the most common extensibility requests for the Cart and Checkout blocks. Check it out here

Conditional Fields 

Developers want the ability to show/hide custom fields based on selected payment or shipping methods. 

Response: This can be achieved using existing API endpoints. Currently, we have examples of this working in the real world with the Conditional Shipping and Payments plugin

Order Confirmation

Developers may need a more flexible order confirmation block that can be customized to display additional information like estimated delivery times, custom notes, etc. 

Response: With WC Blocks 11.2.0 we launched a Blockified Order Confirmation for block themes. We are continuing to enhance this experience to make it more flexible.

Conditionally showing/hiding Payment Gateways – 

Developers may need to conditionally show/hide or re-order payment methods based on custom logic such as user location. 

Response: 

WooCommerce has the existing pieces to expose the pieces of blocks necessary in order to make a more flexible checkout. However, the checkout is such a critical part of the merchant experience, we want to be able to do this thoughtfully. 

We are getting to the point where we are planning to expose more components for extensibility, and this feedback is important to use as we evaluate the most important use cases for our developers. 

New product and order admin

The current product editor using the beta feature lacks a lot of functionality that currently exists in the normal editor, and are concerned with the extent of functionality that will be available in the planned update to the order admin. 

Response: We wanted to get out the most simple version of the product editor in order to start gathering information about what the extensibility experience would look like. Extensibility is one of the reasons that the project is taking longer than expected, because we want to be able to ensure similar flexibility as what is possible with the current editor. As such, your extensibility feedback is integral.

 
Although we haven’t started working on order admin yet, it will likely take a similar approach to product editing experience, which initially supports a very limited use case, and will be iterated on to provide an extensible and user-friendly experience. 

We want your feedback

This meeting was a result of thoughtful feedback from our community of developers. We want to extend our gratitude to the folks who brought up these points to our team:

Maksimer:  Nils-Fredrik Winther-Kaland, Kim Bertelsen, Fredrik Rossland, Nenad Conic & team
Krokedil: Niklas Högefjord, Michael Bengtsson, & team
Atomic Smash: David Darke & team
Neuralab: Krešimir Končić & team
Built Mighty: Jonny Martin & team
Angry Creative: Jimmy Rosén & team

As we continue to evolve our platform, feedback from our community is integral to our shared success, so please join the conversation

We are leaning into GitHub Discussions and have several open discussions in the WooCommerce Blocks and WooCommerce Core repositories. If you aren’t sure where to kick-off a conversation or how to provide feedback, you can always reach out to us in the WooCommerce Community Slack

Leave a Reply

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