WooCommerce Blocks Part 2 — Making the Most of WooCommerce Blocks

surprised married couple read email with profitable proposal from laptop

With the release of WordPress 5.0, the new Gutenberg editor introduced the concept of ‘Blocks’. These are customised code objects that enable media-rich functionality using simple drag and drop editing for ease of use. It wasn’t long before the WordPress developers incorporated this editing experience into the platform’s premier eCommerce plugin, WooCommerce, which now has more than 20 WooCommerce Blocks integrated into the main application. And for those of you who like to be on the cutting edge using the newest additions and updates, there’s also the WooCommerce Feature Plugin. This plugin includes Blocks not yet available in the stable WooCommerce core release, as well as experimental features and the latest possibly unstable updates before these are migrated to the stable core release, so use with care, especially on live stores!

woocommerce blocks
WooCommerce Blocks

As we detailed in Part 1 — ‘Getting Started With WooCommerce Blocks’ — the use of the Block editor allows easy customisation of the look, feel, and functionality of your WooCommerce site, without having to edit complicated web code or CSS styles. Options for each Block type can be found in the Block settings pane of the Block editor, and when using these to their full potential, no two WooCommerce sites need to look or feel the same. Following on from Part 1’s list of 10 basic WooCommerce Blocks, below we feature 10 more Blocks that you can drag and drop into your WooCommerce posts and pages to fully customise the shopping experience for your valued customers.

Showcasing Your Products

These three Blocks will let you automatically showcase your most highly rated products as well as push your on sale items and your own preferred products. The ability to showcase your best performing products in a variety of ways, pushing content out to your customers, is a proven way to maximise your sales.

1. Top Rated Products

woocommerce block top rated products
WooCommerce block – Top Rated Products

The Top Rated Products Block will order your products in a grid by their star ratings, from the highest through to the lowest, with unrated products being listed by your default sorting order. Aside from the various grid display options, this Block’s settings also enable customers to filter the top rated products by their chosen category.

2. On Sale Products

woocomerce blocks on sale products
WooComerce Block – On Sale Products

The On Sale Products Block will, as its name implies, display a grid of the products that you’ve placed on sale. The usual grid options are available, such as choosing the number of rows and columns, and whether to display the product’s title, price, review rating, as well as the add-to-cart button. This grid Block also provides customers with the ability to filter the on sale products by their respective categories.

3. Hand-picked Products

woocommerce blocks hand picked products
WooCommerce Block – Hand-Picked Products

When you need to maximise customer traffic to certain products, this can be easily achieved with the Hand-picked Products Block. You can choose as many products as you need to showcase. And, as with the previous two Blocks, this also uses the WooCommerce product grid for display with all of its standard grid display options.

Exploring Your Product Reviews

In Part 1, we showed you the All Reviews Block, which displays all the reviews that all of your products have received. With these two Block refinements below, you can specify the reviews displayed by product and by category. This extra review functionality can be critical in building your customers’ brand trust in your store and its products while enabling them to make well-informed purchasing decisions.

4. Reviews By Product

woocommerce blocks reviews by product
WooCommerce Block – Reviews by Product

The Reviews By Product Block simplifies the display of a specific product’s reviews. By adding this Block, you can then choose a product from its dropdown list, and all of that product’s reviews will be displayed. There are as yet no further settings for this Block, although the WooCommerce developers are always busy adding functionality to the platform, so watch this space!

5. Reviews By Category

woocommerce block reviews by category
WooCommerce Block – Reviews by Category

Similar to the All Reviews Block, but more focused, the Reviews by Category Block means you can filter your reviews by a specific product category. Further settings include whether to display the product name, image, and rating, as well as the review name and content, the reviewer’s photo, and also a convenient – ‘add to cart’ button.

Exploring Your Product Offerings

A key feature of a profitable online commerce store is its ease of use in navigating through your catalogue of products. Below are five Blocks that will enable you to customise the options available to your customers when browsing your store.

6. Product Categories List

woocommerce blocks categories list
WooCommerce Blocks – Product Categories List

The Product Categories List allows you to easily display a list of all of your store’s product categories using either a convenient dropdown menu or a simple list. Settings options include whether to display category images, sub-categories, the product count for each category, as well as empty categories if needed.

7. Products By Tag

woocommerce blocks product by tag
WooCommerce Blocks – Product by Tag

The ability to filter your products using the Products By Tag Block provides your customers with a fine-grained tagged approach to browsing your product catalogue. Similar to but more flexible than the Products By Attribute Block below, you can add whatever specific tags you need to your products to further differentiate them within their categories.

8. Products By Attribute

woocommerce block products by attribute
WooCommerce Block – Products by Attribute

The Products By Attribute Block, as its name suggests, will enable your customers to filter your products by attributes such as colour and size. These are then displayed in a grid with the usual display options such as the number of rows and columns, the product name, price, rating, and the always handy ‘add to cart’ button.

9. Filter Products By Stock

woocommerce block filter by stock staus
WooCommerce Block – Filter by Stock Staus

This Block will give your customers the ability to easily check on the availability of your products. You can use the Filter Products By Stock Block to filter your products based on whether they are in or out of stock or on backorder. Options include choosing the level of heading display (H2, H3, H4), as well as showing the product count.

woocommerce block search product block
WooCommerce Block – Search Product Block

The Product Search Block provides your valued customers with keyword search capability across your entire product range and is perhaps the most used and useful tool in any online store. This Block can be dragged and dropped onto any page but is probably most useful in a sidebar or your store’s header. It comes with just one setting to display the search field’s label.

WooCommerce Blocks Will Supercharge Your Store!

WooCommerce Blocks are an exciting addition to the WooCommerce editing experience, providing unparalleled ease of use and customisation for your online store. From showcasing your products to pushing their reviews, and enabling the browsing of your online product catalogue, WooCommerce Block editing is supercharging the eCommerce space. And with the WordPress developers working closely with their WooCommerce counterparts, WooCommerce Blocks have a guaranteed and exciting future upgrade path. Using the full potential of this diverse WooCommerce Block functionality on the web’s most popular website platform will make sure that your store’s product offering really stands out from the crowd. The smart use of Blocks can only enrich your customer’s shopping experience, maximising your conversion rates, and thus your profitability. We wish you only the best for the future of your WooCommerce enterprise!

Nick Duell Avatar

Leave a Reply

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