1. Home
  2. /
  3. Blog
  4. /
  5. WooCommerce Basics
  6. /
  7. WooCommerce Variable Products

WooCommerce Variable Products

How to make WooCommerce Variable Products, a Quick Overview

This page contains a long and detailed tutorial, about WooCommerce variable products.
But, the process is really quite simple.

  1. Make attributes of color and size.
  2. Add terms or variations of small medium and large to those attributes.
  3. Make sure your product type is variable. Because you can’t have variations, on a product
    that is not variable.
  4. In your product’s attribute tab, add the attributes and “terms or values” you made in the
    previous step.
  5. In the variations tab, create variations from all attributes.
  6. Set the prices, thumbnail images and shipping class etc for every variation of your product.
  7. You now have a product such as t-shirt, with variations such as color and size.

Building WooCommerce variable products

There are three commonly used product types in WooCommerce

  • Simple products
  • Grouped products
  • Variable products

I’m dealing with WooCommerce variable products in this tutorial

A good example of a WooCommerce variable product is a t-shirt that’s available in three colors and three sizes. Shoppers choose the color and size they want using drop down lists.

WooCommrece variable products t-shirts page

You go through several steps to build a WooCommerce variable product so I’ve made several videos to go with this tutorial.

First you need to know how to make attributes and terms. I’m going to do that in the first video.

Attributes and Terms

In the Dashboard click the Attributes tab

In the Dashboard click the Attributes tab

Type a name for your attribute, then click the configure terms button

The Add New Attribute option when making a WooCommerce variable product

Add new terms of red, green and blue to your color attribute.

Add new terms of small, medium and large to your size attribute.

You now have attributes and terms of…

Color

  • red
  • green
  • blue

Size

  • small
  • medium
  • large

You can now move on to the next step in making your WooCommerce variable product.

Building the basic WooCommerce product

There are three types of physical products in WooCommerce. In this tutorial I’m dealing with variable products.

To add a new product in WooCommerce go to…

  • Dashboard > Products > Add Product
  • Type a title for the page
  • There are two descriptions. The long description goes above the “Product Data” section. The short description goes below the “Product Data” section.
  • Set a product image. Do this in the same way you would normally add a featured image.
  • Add product gallery images. This option is directly below the product image.
  • Categorize and tag your product using the “Product Category” and “Product Tag” options. Product categories and product tags are independent of the WordPress categories and tags used on ordinary WordPress posts and WordPress pages.

Setting Product Data for WooCommerce Variable Product Type

The product data section is sandwiched between the long description and short description sections of the WordPress editor.

Make sure you select the variable product option from the drop down list.

Product data for a variable product in WooCommerce

How to add the Attributes to your variable product

How to add Attributes to a WooCommerce variable product

  • In the Product Data drop down choose: Variable Product
  • Click the attributes tab
  • Click the custom product attributes drop down and select an attribute, color for instance. Then click the Add button. We made the attributes in a previous video.
  • Click the “Used for variations” tick box then click the select all button to add all of the Values (or terms) to this attribute.
  • Repeat this process for any other attributes, such as size.
  • Make sure you click the save attributes button

How to add the Variations to your variable product

  • Click the variations tab
  • In the drop down next to the Go button, choose “Create variations from all attributes”
  • Click the Go button

Create Variations from all attributes when making WooCommerce variable products

WooCommrece will now make variations from all of your attributes. Wait for the process to complete then…

  • CLICK THE EXPAND OPTION!
  • Carefully work through every option for every variation, one by one. Adding the relevant data.
  • You MUST include a price for every variation, most other data is optional.

Add the relevant data for all options fro all variations

Setting all price options for all variations in one go

After you’ve added your variations, you can use the “Add variations” drop down to automatically set, for instance, every price in every variation.

This makes every price the same. So your small red t-shirts would have the same price as your large blue t-shirts for instance.

However, if this is what you want, it’s a quick way to do things.

Set all options for a WooCommerce variable product in one go

Are you looking for a great looking theme to use with your WooCommerce shop? Several of these themes are WooCommerce enabled.

Go to next WooCommerce tutorial →