WooCommerce – Set product variants: Variable products, categories & Co.

Last week I already explained the basics of WordPress and WooCommerce in combination. With it you can easily and uncomplicatedly set up your own online shop. Part 2: Product management & variations.

WooCommerce – Variable products

We’ve also taken a look at the dashboard > WooCommerce and made a few settings regarding countries, languages, tax rates and payment methods. Now we want to go one step further and create products!

WooCommerce Guide - Simple & variable products

Creating products is relatively simple. In principle it works like any post or page you create in WordPress. Similar to keywords or categories in pages you create specific products with specific features. But first we will focus on the product categories:

Create categories

Categories are very useful and quickly explained: trousers, t-shirts, jackets, etc. In order that you do not present your customers with an unsorted online shop, we first define categories. In the example (screenshot) it is shorts and socks.

WooCommerce Guide - Simple & variable products

[shortcode variables slug=”adsense”]

Simple products

WooCommerce Guide - Simple & variable products

At the beginning the following points should be filled out as a rule absolutely:

  • Product name
  • Contribution picture

In the second step we only get to the product data. In the tab ‘General’ you define article number and price. If you have already set everything in ‘Part 1: …’, information like VAT class is already set up.

WooCommerce Guide - Simple & variable products

You can of course specify further details in ‘stock’ or ‘shipping’. However, these are very individual, depending on the company, goods flow and business model. Under ‘linked products’ you can later add articles which are then additionally recommended under the product. After entering all data, we can ‘save’ our product (top right). A ‘preview’ is also already possible.

TIP! If you would like to add a purchase note for your customers to individual products, you will find a small missing text in the tab ‘extended’.

Product variants

Now it will be exciting! Our single product may be enough, but most of you will need a selection! In the example (screenshot) you can see our boxer shorts. We would like to offer them in three sizes and three colours. That’s why we turn a ‘simple product’ into a ‘variable product’.

WooCommerce Guide - Simple & variable products

Select variable product

Once you have selected ‘Varibale Product’, the appearance will change a little. For example, the input field for the price disappears! But that’s not too bad, because you now have variable products.

WooCommerce Guide - Simple & variable products

At this point comes the crux of the matter, where many get out, here begins the art of content management. Fortunately, with WordPress + WooCommerce we have a wonderful open source system that makes everything happen almost magically.

Create variations

First we determine the ‘properties’ that our variable product should have. For this purpose you click once on the tab ‘Properties’. There is no information in the new field, so you press ‘Add’. Now you determine what we will differentiate. In the example it is size (S, M and L). The individual values for size are shown on the right side of the field (screenshot). It is important that the variables are separated by the long vertical line | (Ctrl + Alt + <>-key). Also very important, as in the screenshot, make a check mark at “Visible on product page” and “Used for variations”.

With “Save properties” you confirm your entries.

WooCommerce Guide - Simple & variable productsWooCommerce Guide - Simple & variable products

Set variations

With the product properties formed, we can now set the variations. To do this, switch to the ‘Variations’ tab and link the variants with each other. To do this, you only have to press “Link all variations together”. A popup will appear and confirm this (you will link all variations). After that you will see a confirmation that all variations have been added.

WooCommerce Guide - Simple & variable products

Edit individual variations

Now WordPress + WooCommerce has automatically created all variations for you (next screenshot). In the last step you have to describe each variation individually. This is important for your shop, so you can say later that there are ten blue shirts, but only two red ones.

WooCommerce Guide - Simple & variable products

You now have an article which is available in three variations (in the example: size S, M and L). For every single variation we can (must) now indicate individual stock levels, prices (obligatory because of the variation) or also weight or measure data. Of course we can also provide individual product pictures (e.g. if the colour is different). We limit ourselves in the blog post to article number and price (screenshot).

WooCommerce Guide - Simple & variable products

All done? All gegeched? Then you can either view your product preview or publish your product directly. Of course you have the possibility to create further variations. So you can create a product and design it individually, by size, color, etc.

WooCommerce Guide - Simple & variable products

[shortcode variables slug=”adsense”]