Can I use extra product options with variable products?
WooCommerce Product Options lets you add extra product options to any product type, including simple and variable products. This article explains how it works with variations.
WooCommerce itself lets you add variations to your products, which are displayed in dropdowns on the single product page. There are 3 ways to use variations with extra product options:
- Use variations and product options for the same product.
- Use product options for everything, instead of using variations.
- Select existing variation attributes to display as product options. This is a good idea if you want to display variations in more interesting ways such as checkboxes or color swatches; or if you want to use features which are available for variations but not options such as stock management and variation SKU's.
Display product options underneath the variations
When you add product options to your variable products, then the additional options will appear underneath the variation dropdowns. Customers can select their variations and options, and add the product to the cart with everything selected correctly.
Tip: If any of your products have lots of variations then you can make them quicker to manage by installing our WooCommerce Bulk Variations plugin. This adds bulk options for your variations so that you can perform bulk actions such as setting the same price or image for all variations with a particular attribute:
Replace your variations with product options
If you use WooCommerce then you'll probably know that managing variations can be very time-consuming. The problem is that you need to create a separate variation for every possible combination of options. If you have more than a few types of option then this multiplies up exponentially, and you quickly find yourself managing dozens or even hundreds of variations for a single product.
For example, let's say that you're selling a t-shirt with 8 color options, 3 size options, and 4 style options, and that each style option has a different price. To do this as a variable product, you need 96 variations in total - each with their own size, image, and other settings!
It's much simpler to use product options instead of variations. Each option is managed independently, avoiding these problems. To use the above example, you would create 3 product options:
- Color - You could use a dropdown, radio buttons, or even color swatches to provide a more visual way for customers to choose the t-shirt color.
- Size - You could use a dropdown, radio buttons, or maybe text labels to display the size options.
- Style - You could use a dropdown, radio buttons, or - even better - image buttons so that customers can look at a picture of each style and select their favorite.
You would add an extra fee to certain style options, so that the product price changes depending on which style is selected.
That way, you add each option once and don't need to worry about creating every possible combination. Everything is calculated automatically when the customer selects their options.
Select existing variation attributes to display as product options
When you create a new product option, you can use the Choice type option to choose whether to create the choices directly in WooCommerce Product Options, or select existing variation attributes to display. The second option allows you to display standard product variations using the checkbox, radio button, dropdown, image button, color swatch and text label field types in WooCommerce Product Options.
When you do this, your variations will continue to work with everything else that supports variations. This includes having variation SKU's, managing stock for variations, importing and bulk editing variations, and using any third party integrations that work with variations but not product options.
WooCommerce itself puts some limitations on how variable products work which affects how we can display them using WooCommerce Product Options:
- It is only possible to select one of each attribute at a time. For example, if the customer wants to order a blue and a red t-shirt then they will need to add the blue one to the cart first (e.g. by clicking on a color swatch), followed by the red one.
- Each attribute must always be a required field. That's because it is not possible to add a variable product to the cart until one of each attribute has been selected.
Can I use variations in conditional logic?
The conditional logic in WooCommerce Product Options lets you show and hide options based on the customer's other selections. This is available in the 'Advanced' section when you edit a product option.
You can use conditional logic with product options and product variations - for example, so that an option appears when the customer selects a specific variation. To use it with variations, select the relevant attribute(s) from the 'Condition' dropdown:
If you're displaying variation attributes as options then we recommend not hiding them using conditional logic. This is because they are required and the customer may be confused if they try to add a product to the cart without selecting a required attribute which is currently hidden!