How to create WooCommerce Variable products

Disclosure: This post contains affiliate links as explained in my disclosure policy.

Variable products and attributes

A variable product in WooCommerce is a product with a set of variations that you can specify using product attributes. To understand, we need to know about attributes. There are two types of attributes: Global attributes(or simply attributes) and custom attributes.

Global attributesTerms(values)
sizeSmall, medium, large
crustThick, thin
  
Custom attributesValue(terms)
Types of cheeseCheddar, Mozzarella

However, these attributes are not limited to cheese pizza. Therefore, we can call these attributes Global attributes. Imagine that your restaurant manager decided to introduce two types of cheeses that customers can select only if they buy cheese pizza. Now, the cheese pizza has a custom attribute called a type of cheese/cheese.

Now, all possible variations for cheese pizza would be as follows.

SizeCrust Types of cheese /cheese
Types of cheese
SmallThickCheddar
SmallThinCheddar
SmallThickMozzarella
SmallThinMozzarella
   
MediumThickCheddar
MediumThinCheddar
MediumThickMozzarella
MediumThinMozzarella
   
LargeThickCheddar
LargeThinCheddar
LargeThickMozzarella
LargeThinMozzarella

Creating a variable product

Creating global attributes

Go to Products => attributes on WordPress dashboard.

After adding the attribute, you can see it on the right side of the dashboard.

Click on configure terms to add terms to the attribute.

After adding terms:

If you go to Product => attributes, you would see the attributes with terms added

You can add the other global attribute(size) and its terms(small, medium, large) as above. After I added all global attributes, it will be as follows. You may change the order and slug as you wish.

Set up variable product

Add attributes to the product

Click on Product => Add New

after you add a name for the product( ex: cheese pizza ), an image, description, make the following changes on the product data panel. (if you do not know how to add new products, please read this post)

After you click on add button the attribute “crust” is added to the product.

Click on “Select terms” and add values to the attribute. You can also click on the “Select all” button if you need to add all the terms as values.

If you want to add a new term, you can do so by clicking on “Add new”, and then give it a name(ex: crispy).

By default, WooCommerce adds attributes to the product page. That is why the option “Visible on product page” is selected. We will leave it as it is.

We are going to create variations for the product. Therefore, select the “Used for variations” option. After all these changes, click on the “Save attributes” button.

Now, do these same steps for the “Size” attribute as well. Remember to add values for the “Size” attribute: small, medium, and large.

Add custom product attribute

make the following changes and click on “Save attribute”.

Set up variations

After you add attributes to the product, it is time to create variations for the product from all attributes. First, click on “Variations” on the “Product data” panel, choose “Create variations from all attributes” and click on the “Go” button. (Note that you can add variations one by one with the “Add variation” option).

This will create 12 variations presented with dropdown lists.

You can set default options to appear in the product page form. Ex: crust: thick,  size: medium, cheese: cheddar.

We need to add the regular price for each variation. Move the mouse over the first variation, you will see an arrow to expand the selected variation.

Enter “Regular price” as 8.

Use the following guideline to enter “regular price” for each variation.

Any small pizza => $8

Any medium pizza => $10

Any Large pizza => $12

Finally , click on the “Save changes” button.

Customizing the product page

You can customize labels and controls in the product page with WooCommerce hooks(actions and filters) or adding your code to the template files. WooCommerce encourages the use of hooks. However, you need to have significant knowledge in PHP, JavaScript, and WooCommerce hooks to customize product pages and their functionality with regard to variable products. A much better approach for customization is to use plugins. Plugins give you more control over setting up and configuring variable products and are updatable with the new versions of WooCommerce and WordPress.

some of the plugins you can use to customize product variations

Conclusion

Variable products are the complex product type that is but upon product attributes. WooCommerce provides great control over setting up variable products. With the use of plugins, you can improve the user interface and functionality of product pages displaying variable products. This will increase your sales as user experience is of utmost importance for any cutting-edge eCommerce system today.

Related Post

Leave a Reply

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