Creating Your First WooCommerce Product
Welcome to the next Upload WP tutorial on how to build a professional eCommerce site using WordPress, WooCommerce, and the WooStore theme. Before we begin with our product setup tutorial I want to take a moment to Thank You for following along with us thus far. The feedback that we've received has been tremendous and my hope is that this series helps you create a profitable site using the power of WordPress and WooCommerce. Also, if you find this series to be helpful I would encourage you to subscribe to our YouTube channel “UploadWordPress“. We plan to create many more theme specific WordPress tutorial videos in the near future.
In the first few tutorials we showed you how to install the WooCommerce plugin and WooStore theme, we touched on some of the important WooCommerce settings, and we created the WooStore product categories. Today we're going to show you how to how to create your first WooCommerce variable product. However, before we dive into the details of product setup it's important to point out the different types of products that you can create with WooCommerce.
The types of products supported by WooCommerce are as follows…
- Physical products
- Digital / downloadable products
- Grouped / bundled products
- Product variations / variable products
- External / affiliate products
Creating products with WooCommerce is very similar to creating normal WordPress blog posts. The “Add Product” page in the WordPress admin looks almost identical to the “Add New” post blog page. The type of product that we create in this tutorial is classified as a “variable product”. Variable products involve the setup of both product attributes and variations.
If you're like most people then you'll probably find the whole “product attribute and product variation” thing a bit confusing at first. However, the good news is that once you grasp the concept and get past the setup of your first couple products, you'll find that it's easy to add additional products. You'll have a product template that you can simply “copy to a new draft” which will allow you to add additional products very fast.
WooCommerce Product Attributes and Product Variations Explained
WooCommerce makes it easy to create an unlimited number of product attributes and product variations which is essential functionality for most eCommerce sites. Examples of product attributes would be things like Size, Color and Weight. Variations are a bit more difficult to explain. Essentially, product variations use each attribute to create a slightly different option from the main product. Technically, each variation is it's own individual product.
For example, let's say our base product is a white t-shirt. As the merchant, we probably want to have 4 different sizes of that white shirt available for purchase. Therefore, we'd have a “Size” attribute with a Small, Medium, Large and X-Large “attribute value”. In addition to the Size attribute we'd have 4 variations that would show up as a drop-down box on the product details page of the website. The 4 variations would essentially be four separate sub-products of the main product which is the white t-shirt. Each of the variations could potentially have their own SKUs, prices and shipping methods if needed.
How to Create a WooCommerce Variable Product in the WordPress Admin
Step 1: On the “Add Product” page of the WordPress admin scroll down to Product Type and in the drop down box select “Variable product”.
Step 2: Next, scroll down to the “Product Data” section and click on the Attributes tab > click Add > enter the attribute Name (Size) > in the Values text box enter the available sizes (e.g. Small, Medium, Large, X-Large) and separate each value with the “Pipe” Symbol > check the “used for variations” box (make sure the “Visible on product page” box is not selected) > scroll to the top of the page and click on “Save Draft”.
How to create the “Pipe” symbol…
The usage of the “Pipe” symbol is required to separate each attribute value. To create the Pipe character hold the Shift key and the Backslash key. The Pipe symbol looks like this… |
Step 3: Now that the Size attribute has been created and values have been added, it's time to setup the variations. Click on the Variations tab > click Add Variation > select “Small” from the drop down box >give the variation a Price, Sale Price (optional), Shipping Class (optional), Tax Class (optional), and Stock Quantity (optional) > click Add Variation and repeat this process for each additional attribute (e.g. Medium, Large, X-Large) > scroll to the top of the page and click “Save Draft”.
Important WooCommerce Product Setup Notes…
- Product attributes must be created before product variations.
- Each variation is treated as its own product and can be given a specific SKU, price and shipping class is so desired.
- Recommended WooCommerce Featured Product image Size is 420×420
- Try to keep your product images as uniformed as possible. I recommend creating a template for your product images so they all look the same. Uniform product images will help make your WooCommerce site look more professional.
- The Featured Products check-box has been moved in version 1.4.2 of the WooStore theme. The featured product check-box is now located on the right-hand-side of the product update page in the WordPress admin. More specifically, the WooCommerce Featured Product check-box is located in the Publish widget > Catalog Visibility
Please use the new Upload WP Community Forums to post questions and comments on setting up variable products in WooCommerce. Thanks