How to add additional options to a variable product in WooCommerce

As an online seller, you might need an easy way to add additional options to variable products. This is perfect for selling customizable variable products. However, WooCommerce out of the box doesn’t let you add product fields or options to individual variations.

The good news is that you can use a “product options” plugin, like Advanced Product Fields for WooCommerce, to add additional options to variable products. And, in this tutorial, we’ll show you how you can add options to individual variations in WooCommerce.

Let’s put everything into context before we begin.

Why add additional options to variable products?

If you sell variable products, you might consider adding additional options to some (or all) of them. “Additional options” can be anything that lets customers personalize the variable product. Here are some examples:

  • Different field types. You can add field types to variable products such as text boxes, dropdown lists, number fields, checkboxes, image swatches, file upload fields, and more. Customers can use these fields to personalize the variation they’d like to purchase.
  • Quantity-based options. You can add quantity-based options to let customers enter values for each unit they’re ordering. So, whenever a customer increases the product quantity on the single product page, the additional options you’ve added appear multiple times.
  • Automatically update images. To deliver a good user experience, you can configure the main product image on the single product page to update based on the customer’s selection. For example, if the customer selects a blue T-shirt, the main product image should update to show a blue T-shirt.

Now you might be wondering: why should I add additional options to variable products? The main reason store owners add additional options to variable products (i.e. individual variations) is to offer customers more purchasing options. It’s a great way to enhance the online shopping experience and, potentially, boost sales.

What’s more is that adding additional options to variable products makes it easy to sell customized products. Instead of having customers detail their personalization requests in order notes, you can set up fields for them to fill out.

Adding options to variable products vs individual variations

Put simply, there are tons of ways to add options to variable products depending on the types of products you sell. Using the Advanced Product Fields for WooCommmerce plugin, you can let customers choose an image to print on a T-shirt regardless of which variation they select and add specific options for specific variations only.

Here are some examples:

  • Apparel. If you sell apparel (such as T-shirts, hoodies, shoes, or caps), you can let customers personalize their orders by allowing them to enter custom text or images to be printed on the item.
  • Tickets. If you sell tickets, you’re probably already creating different types or variations. For example, for each ticket you create, you might have two variations – General Admission and VIP. You can use the Advanced Product Fields for WooCommerce plugin to let customers who purchase the VIP ticket choose their swag bag contents.
  • Jewelry. Stores that sell personalized jewelry items may offer certain options for some variations but not others. For example, you might want to offer engraving options for gold jewelry but not silver jewelry.

Let’s say you sell custom T-shirts in white, blue, and red. You want to give customers the option to upload an image to print on to the T-shirts and give customers who purchase the white variation the option to have the T-shirt dyed a specific color.

This is possible with the Advanced Product Fields for WooCommerce plugin.

How to add additional options to variable products in WooCommerce

Here, we’ll show you how to add additional options to variable products in WooCommerce – the easy way!

For this tutorial, we’ll assume you already have a WooCommerce site set up with some variable products that you’d like to add options to.

Step 1: Install the Advanced Product Fields for WooCommerce plugin

The first thing you need to do is get the Advanced Product Fields for WooCommerce plugin. It lets you add extra options to variations in a few simple steps. The best part is that there are 16 different input types to choose from, so you can add as many options as you’d like.

enter your license key

Once you’ve installed and activated the plugin on your WordPress website, head over to WooCommerceSettings Product fields from the admin panel to activate the plugin license key.

Step 2: Configure the plugin settings

From the same screen (i.e. WooCommerceSettings Product fields), you can configure the plugin’s settings. These are divided into three sections:

Product field settings

These settings let you decide where you’d like to show the customer’s selected options. You can choose to show in the cart, on checkout, and in a mini-cart.

product field settings

In addition to this, you can also show price hints, which is useful if the customer’s selected option changes the product’s price.

File upload settings

The file upload settings are designed to help you prevent spam submissions (if you decide you need a file upload field on your product pages). For this reason, we recommend enabling the Must be logged in option if you intend on using the file upload field in any of your variations.

File upload settings

Enabling the option requires customers to be logged into their accounts to upload files. The Advanced Product Fields for WooCommerce plugin lets you set a custom message and enable AJAX upload if you’d like.

Date picker

The date picker settings allow you to enable date fields and set the date format.

Enable date fields

Click the Save changes button at the bottom of the screen to continue.

Step 3: Add options to variable products

Now that you’ve configured the plugin’s settings, all that’s left to do is add options to variable products.

We’ll show you how to add additional options to a T-shirt product that has three variations. To set it up, you’ll need to create a product field group. Head over to WooCommerce Product Fields from the admin panel and click on the Add New button. Give the product field group a title.

Following our example from before, let’s say you want to give customers the option to:

  • Upload an image to print on to the T-shirts and
  • Give customers who purchase the white variation the option to have the T-shirt dyed a specific color.

Create fields

First, you’ll need to use the Fields metabox to set the fields. Click the Add your 1st Field button to start adding additional options. Here’s how you should set up the first field:

Add a file upload field
  1. Set the Type to File Upload.
  2. Enter a Label and Instructions.
  3. Choose the Accepted file types from the dropdown.
  4. Enter the Maximum file size (MB).
  5. Optionally, you can choose to adjust pricing.

And here’s how you should set up the second field:

Add color swatches
  1. Set the Type to Color swatches.
  2. Enter a Label and Instructions.
  3. Set different colors as available options using the Options field. You can also adjust the pricing.

Set conditions

Once that’s done, use the Conditions metabox to configure when the field group should be displayed. Since we want both fields to appear for the white T-shirt variation only, we’ll set as follows:

The conditions section
  1. Set the first dropdown to Product variation.
  2. Set the second dropdown to Any in list.
  3. Enter the variation(s) you’d like the field group to appear on. Following our example, we’ll choose T-shirt (White).

This ensures that the fields created above will only appear on the White T-shirt variation.

Click the Publish button to continue.

Setting up the remaining variations (through duplication)

By now, we’ve added additional options to the white T-shirt variant. Now, we need to add the file upload option to the remaining T-shirt variants, i.e. red and blue. The easiest way to do this is by going to WooCommerce Product Fields from the admin panel and duplicating the first product field group.

conditions section

Once that’s done, simply remove the second field (i.e. the color swatches field) from the Fields metabox and set the Conditions as follows:

  1. Set the first dropdown to Product variation.
  2. Set the second dropdown to Any in list.
  3. Enter the variation(s) you’d like the field group to appear on. Following our example, we’ll choose T-shirt (Red) and T-shirt (Blue).

Click the Publish button to continue. Here’s what it will look like on your site when a customer selects the white T-shirt:

Example of advanced product fields on your product page

And here’s what it looks like when a customer selects the red or blue T-shirt:

Note there’s no “Color” field with this variation.

Conclusion

If you sell variable products in WooCommerce, the Advanced Product Fields for WooCommerce plugin makes it easy to add additional options to variable products and individual variations. This means the plugin allows you to conditionally display extra options per each variation.

All you have to do is create field groups and assign them to the variations you’d like to offer them for by setting conditions.

Get the Advanced Product Fields for WooCommerce plugin to add additional options to variable products!

Share

Join the discussion

Your email address will not be published.