Adding Variable Products in Woocommerce

WooCommerce-variable-product

Adding Variable Products in Woocommerce

Variable products are a great feature of WooCommerce for offering variations of a product such as the color and size on a different prices.

Below is a step by step tutorial on how to:
1. create a product and set product image and gallery
2. set the product type (variable product)
3. define variation attribute (color)
4. add variations (color and image)

Step 1: Create a product and set product image and gallery.

To do this, go to WP Dashboard >Products>Add Products. Scroll down to the bottom right and click on Set product image to add a product image. You can also add a gallery under the product image by clicking on Add product gallery images. Then publish / save it.

new-product
product-on-website-view

Step 2: Set the product type

On the same page which is the product page, click on the drop down box beside Product Data and choose Variable Product.

product-data

Step 3: Define variation attribute (color)

Click on Attributes > Add

attributes-add

Under Name field, type the word Color, and then under the Value(s) box, enter the color names by pipe ( | ) separating values and make sure to check the box that says Used for variations. Then click Save Attributes and Update the page.

attribute-name-value

Step 4: Add variations (color and image)

Click on Variations tab and click Add Variation. Choose Blue from the drop down box and click on the box that says “Woo” to upload an image. Please don’t forget to put any price on the price fieldor else the variation on the live site won’t show up.

add-variation
add-variation-2

Do the same process for the colors Pink and Green. Click on Add Variation again and choose thecolor and upload the image of each shoes. After doing that click on Update button and test your site online.

online-shop
Tags:
No Comments

Post A Comment