How to make a ‘Complete the Look’ product in WooCommerce

freestocks org 187367 unsplash

‘Complete the Look’ or ‘Shop the Look’ is a really effective way to upsell from your WooCommerce store. In this article, I’ll show how you how to create a ‘Complete the Look’ product using WooCommerce and the ‘Products’ field in the WooCommerce Product Add Ons Ultimate plugin.

What is ‘Complete the Look’?

You will very commonly see ‘Complete the Look’ pages on clothing and apparel websites. ‘Complete the Look’ allows your customers to purchase all the items for an outfit from one page – they can buy a complete wardrobe, consisting of multiple items, from a single product page.

WooCommerce complete the look product

So, for example, if your customer is on the product page for a pair of jeans and the product image shows the model also wearing a shirt, shoes and jewellery from your product range, you can offer these additional products direct to the customer for them to add to their cart without them needing to visit another product page.

By making purchasing additional products so convenient for your customers, you’re increasing your sales and profit.

Other examples of where to use ‘Complete the Look’ style pages

But it’s not just clothing sites that can benefit from this technique. This works well for any product that has accessories and other related products. The most popular and profitable online store in the world, Amazon, uses this on every page for every product with its ‘Frequently bought together’ feature.

Frequently bought together WooCommerce

Amazon encourages its customers to spend more by presenting them with additional products that complement the product they’re viewing.

Take a look at this article for how to create a frequently bought together section in WooCommerce.

More effective than cross-selling or upselling

WooCommerce allows you to cross-sell and upsell by linking products together. However, the difference is that your customer still has to click from one product page to another in order to make the purchase. By creating a ‘Complete the Look’ with WooCommerce Product Add Ons Ultimate, your customer can buy everything they want with one click.

The WooCommerce Product Add Ons Ultimate child products field allows you to select products to associate with each product (just like the upsells feature) but allows the customer to add multiple products to the cart with one click.

Better than automatically created recommendations

WooCommerce will automatically generate recommended products based on product categories. There are also some plugins out there that will use purchase history data to make intelligent choices about recommended products.

But with WooCommerce Product Add Ons Ultimate, because you know your products best, you choose the products to offer – so you’re not relying on WooCommerce trying to match products by category or tag. You’re selecting the exact products that are going to convert best.

How to create a Complete the Look page

In our example, we’re going to create a product page for a woman’s top but which allows the customer to buy jeans, shoes and jewellery as well.

WooCommerce complete the look product

You can see a working example of this page here.

Install WooCommerce Product Add Ons Ultimate

I’m assuming that you already have your WordPress and WooCommerce site up and running so the first step is to purchase and install WooCommerce Product Add Ons Ultimate. Please note that to use the ‘child products’ field you’ll need the Pro version.

When you’ve purchased WooCommerce Product Add Ons Ultimate, you’ll get an email with a link to download the zip file. Download it then go to Plugins > Add New > Upload Plugin in your dashboard and upload the zip.

Activate the plugin then go to WooCommerce > Settings > WooCommerce Product Add Ons Ultimate and enter your licence key (you’ll find this in the email with the download link). Enter your key and save the page.

You’re ready to start.

Edit a product

Go to a product where you’d like to add your ‘Complete the Look’ section. In the WooCommerce Product Data section, click on the WooCommerce Product Add Ons Ultimate tab.

Click Add Group to create a new group of extra fields. You can give the group a title and description if you like.

Click Add Field to create your first field. Give the field a title like ‘Complete the Look’ or ‘Would you like to add’ and choose ‘Products’ for the field type. The Products field type allows you to add child products as addons to your main product (find out more here).

In the ‘Child Products’ field, select which products you’d like to promote.

WooCommerce complete the look settings

Note that you have some additional choices here:

Products Layout

Choose ‘Column’ to create a single-column layout. The advantage of using ‘Column’ here is that you can add variable products as child products and WooCommerce Product Add Ons Ultimate will deal with the variations.

Alternatively, you could choose:

  • ‘Checkboxes’ to allow your customer to select multiple products. Products will be displayed with their featured image as a thumbnail.
  • ‘Radio’ to only allow the customer to select one product from the field.
  • Or ‘Select’ to display the child products in a dropdown field.

Products Quantities

Choose ‘Independent’ to allow the customer to select different quantities for each product. For instance, they could choose to purchase one of the main product, two pairs of shoes, and three pairs of jeans.

Alternatively, you can set this field to ‘Linked’ which means that the purchasable quantity of the child products will always be the same as the purchased quantity of the main product. Or you can choose ‘One only’ which means the customer can only purchase one of each child product.

Number Columns

If you choose ‘Checkboxes’ in the ‘Products Layout’ field, you can select a number between one and four in the ‘Number Columns’ field to determine the column layout for your child products.

When you’ve completed all the fields, save the product. Your customers will now be able to add multiple products to their cart with a single click.

It’s as simple as that. Click the banner below to find out more about WooCommerce Product Add Ons Ultimate.

WooCommerce Product Add-Ons Ultimate featured image

WooCommerce Product Add-Ons Ultimate

Personalize products with extra fields and custom options

Find Out More

Four comments

  1. User image

    On the options total the price is not adding the VAT 20% that is being added dynamically to all prices. Can you help out here?

Leave a Reply

Your email address will not be published. All fields are required.