A variable product in WooCommerce is a type of product that allows a product to be divided into different variations.
If you are familiar with WooCommerce, you already know the basic concept of variable products.
You can follow my previous tutorial to know everything about a variable product, variations, attributes, and other product options you may need to know.
We have created a video tutorial on the same topic –
Hide out of stock products
You need to avoid user frustration by never letting them pick a product or product variation they can’t purchase.
Follow these simple steps to hide out of stock products –
This current guide is on how you can disable out of stock variations in variation swatches.
I hope you have learned the basics of how you can use variable products. Now you need to know what to do when a product is out of stock.
- Head to your WordPress admin dashboard.
- Navigate to Settings under the WooCommerce tab.
- Click on the Inventory link.
- Enable Hide out-of-stock items from the catalog.
- Save your settings.
Your out-of-stock items will be disabled at your online store.
Though out-of-stock items can be hidden from the default WooCommerce settings, doing this will hide out-of-stock items everywhere on your online store.
However, you may want to hide out of stock for variation products only.
By default, WooCommerce doesn’t blur or cross out any variations that are not in stock. It allows the user to select the variation first, then lets them know it’s out of stock.
But, that’s time-consuming and hassle for the customers. That’s why we recommend the Variation Swatches plugin for your product variations.
The plugin turns the product attribute select dropdown into beautiful swatches. That means your product variation selection dropdown can be changed into color, button, radio, and image swatches.
Additionally, you can cross out-of-stock products or make those blur. The customers can shortlist the product for purchasing for a later date.
Hide, Blur, or Cross out of stock variation
By default, WooCommerce doesn’t blur or cross out any variations that are out of stock. You need to install and activate the WooCommerce Variation Swatches plugin.
You can follow this guide for three different methods of installing WordPress plugins.
For example, you are selling headphones in different colors like black, green, and red.
But your green headphone is currently out of stock. Follow the below steps to hide out of stock variations:
- Head to Swatches from your WordPress admin dashboard.
- Navigate to the Advanced tab
- Select Hide option for Attribute behaviour.
- Save your settings.
Once you follow these steps, your out of stock product will not be on the list:
To show a cross sign with blur on your out of stock variations:
- Head to Swatches from your WordPress admin dashboard.
- Navigate to the Advanced tab
- Select Blur with cross for Attribute behaviour.
- Save your settings.
Your product frontend will look like this:
To blur without cross your out of stock variations, you need to follow these simple steps:
- Head to Swatches from your WordPress admin dashboard.
- Navigate to Advanced tab
- Select Blur without cross for Attribute behaviour.
- Save your settings.
Your product frontend will look like this:
When you have product variations on your online store, it will help you gain more revenue. This tutorial will reduce user frustrations, as they will not select the product when it is out of stock.