How to Create Variable Product in WooCommerce Flatsome Theme

Most consumer loves to choose from multiple options.

You are probably wondering how to create these options for your site visitors.  

The good thing is that the WooCommerce platform makes this possible using the WooCommerce variable product feature.

The great thing about WooCommerce variable product is that it is as easy as it sounds. Adding variable products in the Flatsome theme is even more comfortable. 

In this article, you’ll understand the variable product and type and how to set it up in Flatsome WooCommerce-powered website.

You will also learn to extend them with a WooCommerce variable product plugin.

What is a variable product in WooCommerce?

Variable products in WooCommerce lets you create specific products that have multiple variations.

For example, you can put five colors of a t-shirt on display for your customers. You can add color, images, size, or any other variation your product might have. It includes setting up attributes, terms, and variations.

By default, WooCommerce allows you to add different types of products, including:

Simple product:

A simple product is a unique, stand-alone, physical product that you may have to ship to the customer.

 
 
simple product
 
 

Grouped product:

The identity of the grouped product is created by several child products with unique features.

grouped product
 
 

Virtual product

A virtual product is defined as a product that is not a physical entity. You can select the checkbox to make a product virtual.

virtual product
 
 

Downloadable product:

Downloadable products don’t require shipping. They are available as downloadable files with a specified path or URL. You can select the checkbox to make a product downloadable.

downloadable product
 
 

External/Affiliate product:

Sometimes, you list a product in your store, but you aren’t the actual seller of the product. You will have to specify the URL of the product and the text to be displayed on the Add-to-cart button. In the case of affiliate marketing affiliate plugin for WordPress helps a lot.

affiliate proudct
 
 

Variable product:

Variable product type lets you add variations to the same product to create a complex, variable product. Each product variation has its price, available stock, SKU, etc.

 
 
variable product
 
 

Create Variable Product in Flatsome WooCommerce Theme

The basic concept of WooCommerce variable products is outlined above. So, it’s time to put that knowledge into action.

Follow the step-by-step guide below to create variable products for your WooCommerce store.

The basic concept of WooCommerce variable products is outlined above. Now it’s time to put that knowledge into action. You can also create variable products in the Astra theme if you want.

If you prefer video tutorials over text, you can follow this guide to create WooCommerce Variable products in Flatsome Theme.

https://www.youtube.com/watch?v=wpZNHzsqgpg
 
 

Create product attributes

You can’t create a variable product without adding an attribute because attributes define product variations.

For example, a t-shirt size could either be small, large, or medium. Here, ‘size’ is the attribute, while ‘small,’ ‘large,’ and ‘medium’ are the product variations.

There are two types of attributes in WooCommerce; global product attribute and custom WooCommerce product attribute.

Global product attributes can be applied to multiple products in your store. For example, your store t-shirt can have both ‘size’ and ‘color’ as global attributes. Therefore, you don’t have to keep adding the same attributes.

On the other hand, custom product attributes are specific to one product only. You can’t apply it to another when you create custom product attributes.

In the next step, we are going to start with creating attributes –

 
 

Step 1: Creating attributes:

You need to create attributes before creating your variable product.

  • Under the ‘Products’ section, choose ‘Attributes’ in the left menu bar.
  • In the ‘Name’ field, add the title of the attribute.
  • The slug field is optional.
  • To finalize the changes, click on the ‘Add attribute‘ button.
 
 
attributes in flatsome
 
 
  • New attributes are now listed in the table to the right.
variable attribute
 
 

Step 2: Add specific values of an attribute:

 
 
  • Click ‘Configure terms’ in your attribute’s ‘Terms’ column.
 
 
variable term
 
 
  • There is an ‘Add new Color’ form on the left side.
 
 
add color in flatsome
 
 
  • Add each color you sell clothing in (such as green, blue or red)
  • Click the ‘Add new color’ button on the left side (you can add as many colors as you need).
  • You can enable WooCommerce color swatches if you want.
 
 

Step 3: Adding attributes to an individual product.

 
 
  • Navigate to ‘Products’ from the left menu bar. You can add either a new item or edit the existing one.
 
 
  • From the drop-down of the ‘Product data‘ section, select ‘Variable product.
variable product section
 
 
  • Head to the ‘Attribute’ tab. A list of attributes you have created for your products is visible here.
  • Select one of the attributes from the list. Here, I have selected the ‘color’ attribute.
 
 
variable product section
 
 
  • You can select more than one option or click on the ‘Select all’ button.
  • Don’t forget to check both ‘Visible on the product page’ and ‘Used for variations.’
  • Then click on ‘Save attributes.’
  •  Note: if you want, more attributes can be added (from the ‘Add new’ button).
 
 
variable product data
 
 

Step 4: Add variations to your product.

 
 
  • Right below the Attributes, navigate to the ‘Variations’ section and select ‘Add variation’ from the drop-down.
  • There will be a new drop-down menu after you hit the ‘Go’ button.
 
 
variation flatsome
 
 

Now it’s time to choose the attribute for your variations (such as a particular color).

 
 

Step 5: Customize the rest of the setting.

  • Expand the variations panel
  • This allows you to add different information for each variation.
  • There are options to upload an image, add the price, stock status, dimensions, and more.
  • But it’s mandatory to set a price for variation.
  • To finalize the changes, click on ‘Save changes.’
 
 
variable product in flatsome
 
 

Press the ‘Publish’ button after picking up the appropriate category for your variable product.

You are done. Now see your result –

 
 
dropdown in flatsome theme
 
 

Extend with a powerful WooCommerce plugin

When you display variable products as swatches will be more appealing to your online store visitors. 

You need a plugin to create a new experience for WooCommerce product variations.

An example of such a plugin is the WooCommerce Variation Swatches plugin. The plugin lets you display your WooCommerce product variations as swatches.

 
 
swatches in flatsome theme
 
 

The look of a product page will be changed into button swatches immediately after installing the WooCommere Variation Swatches plugin. But you can upgrade to the pro version to show the default dropdown menu into color, image, and radio button swatches on the shop or archive page.

We hope the tutorial has helped you to learn the steps needed to add variable products in the Flatsome powered WooCommerce store. If you need more WooCommerce tutorials on the Flatsome theme let me know in the comment section. I’ll write the next tutorial for you.

See also  How to Add Testimonial in WordPress to Flatsome Powered Website


Subscribe To Our Newsletter!
Hi, I’m Mohamed. I share delicious recipes that I have cooked and loved. I’ve been food blogging for over 10 years and have a Diploma in Nutrition. You will find many healthy recipes as well as my favourite comfort food on the blog because I believe in a balanced diet.

Related Posts

Fintech’s biggest hits and misses of 2023

As 2023 comes to a close, we’re here to look back at the biggest fintech stories of the year. Silicon Valley Bank’s implosion felt like a fintech…

It’s critical to regulate AI within the multi-trillion-dollar API economy

Alex Akimov Contributor With two decades of tech leadership experience, Alex Akimov, former head of API at Adyen, now revolutionizes embedded finance at Monite by building best-in-class…

EU’s provisional deal on gig worker rights fails to get enough backing from Member States

Not so fast on that Christmas present for precarious gig workers in the EU: A political deal announced mid month, which aims to bolster platform workers rights…

Arduino exploring India manufacturing to limit counterfeit sales

Arduino is considering manufacturing in India. The startup, best known for its open source microcontroller boards, hopes to restrict the rise of counterfeit boards and cater to…

Top robotics names discuss humanoids, generative AI and more

Last month, I took an extended break. In a bid to keep my robotics newsletter Actuator (subscribe here) up and running, however, I reached out to some…

Pornhub owner pays US government $1.8M to resolve sex trafficking probe

Pornhub’s parent company Aylo Holdings will pay $1.8 million to the U.S. government to resolve a charge of profiting off of sex trafficking. The company, formerly known…