A group of products linked by attributes is called a “variation group”.
For this example you’ll be creating a variation group of iPhones. The iPhone comes in different colours and storage amounts. As such, our products will be linked by Colour and Storage.
Create the Product Attributes
To create a linked variation group, you firstly needs some attributes available. Let’s create
Colour and Storage attributes.
- Navigate to Products > Attributes.
- Under Add new attribute, enter your attribute name. For example “Colour”.
- Leave the rest of the settings as they are and click Add attribute.
- Once added, click Configure Terms.
- The iPhone X comes in 2 colours; Space Grey and Silver. We’ll add these as terms. Enter Space Grey into the Name field.
- Leave the other fields blank and then click Add new Colour.
- Repeat this step to add the other colours.
- Now add the Storage attribute and terms.
Create the Products
Unlike a typical variable product, WooCommerce Linked Variations will group together any product types. For this example we’ll link 4 simple products;
iPhone X – Space Grey / 64GB, iPhone X – Space Grey / 256GB, iPhone X – Silver / 64GB, and iPhone X – Silver / 256GB.
- Go to Products > Add New.
- Enter the product title.
- Go to the Product Data meta box.
- Enter a regular price for the product.
- Click on the Attributes tab.
- In the dropdown that currently says Custom product attribute, select Colour.
- Click Add.
- Click in the Value(s) field and select the colour of this product. (Note: You should only select one value for each attribute).
- Repeat for the other attributes.
- Add your product images and publish the product.
- Repeat these steps to create the other products.
Create the Linked Variations Group
Now that the products and attributes are ready, we can link these products together to create a linked variations group.
- Navigate to Products > Linked Variations.
- Click Add New.
- Enter a title for the group.
- In the Products field, start typing the name of your products and select them all.
- Click the Colour and Storage checkboxes. You can drag/drop to change the order they appear on the product page.
- Click Show images? if you want the values for the first attribute in the list to be displayed as the relevant product images. As our attribute is Colour, this make sense.
- Click Publish.
Try It Out
You’re ready to try it out!
- Navigate to one of the products you added on the frontend of your website.
- You’ll now see the product has Colour and Storage options available. The Colour options show the product images, as per our settings.
- Click one of the other options and you will be liked through to the respective product page.