{"id":49480,"date":"2015-06-19T00:59:46","date_gmt":"2015-06-19T04:59:46","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=49480"},"modified":"2015-06-19T00:59:46","modified_gmt":"2015-06-19T04:59:46","slug":"jigoshop-how-to-add-variable-product","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/jigoshop-how-to-add-variable-product.html","title":{"rendered":"Jigoshop. How to add variable product"},"content":{"rendered":"<p><strong>Variable Product<\/strong> is a name for any product which allows a customer to select from different product options as part of their purchase. It may also be referred to as <strong>Configurable Product<\/strong>.<\/p>\r\n<p>Jigoshop allows you to create an unlimited number of options for any product by using <strong>Attributes<\/strong> to set a range of options.<\/p>\r\n<p>This tutorial will guide you on how to add a variable product in JigoShop.<\/p>\r\n<a href=\"http:\/\/www.youtube.com\/watch?v=OvF4qByuveQ?width=1280&amp;height=720\" rel=\"prettyPhoto\">Jigoshop. How to add variable product<\/a>\r\n<ol><li><strong>Creating the attributes<\/strong>\r\n\t<ol><li><p>The first step is creating the product attributes.<\/p><\/li>\r\n\t\t<li><p>Navigate to <strong>Products<\/strong> then <strong>Attributes<\/strong>.<\/p><\/li>\r\n\t\t<li><p>Type the name of your new attribute, choose <strong>Multiselect<\/strong>, then click <strong>Add Attribute<\/strong>:<\/p>\r\n\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.1.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.1-300x205.jpg\" alt=\"how to add a variable product.1\" width=\"300\" height=\"205\" class=\"aligncenter size-medium wp-image-49481\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.1-300x205.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.1-150x102.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.1-1024x699.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.1.jpg 1025w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t\t<li><p>Now add our various sizes to this attribute. Click on the title of your newly created attribute. Note: do not click on <strong>Edit<\/strong>, click the actual name instead.<\/p><\/li>\r\n\t\t<li><p>Fill in the name and optionally a slug (slug is automatically filled out), then click <strong>Add New Size<\/strong>. You can leave <strong>Parent<\/strong>, and <strong>Description<\/strong> blank. If you would like your variations to show up in a specific order, use the <strong>slug field<\/strong> to handle that. For example, if you want to display: <em>S M L XXL<\/em>, then for slug you would have <em>01S 02M 03L 04XXL<\/em>.<\/p>\r\n\t\tYou should now see something similar on the right side:\r\n\t\t\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.2.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.2-300x151.jpg\" alt=\"how to add a variable product.2\" width=\"300\" height=\"151\" class=\"aligncenter size-medium wp-image-49482\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.2-300x151.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.2-150x76.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.2-1024x516.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.2.jpg 1378w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\t\t\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.3.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.3-300x110.jpg\" alt=\"how to add a variable product.3\" width=\"300\" height=\"110\" class=\"aligncenter size-medium wp-image-49483\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.3-300x110.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.3-150x55.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.3-1024x376.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.3.jpg 1113w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t\t<li><p>Repeat these steps for any other attributes you would like to create, for example a Colour attribute.<\/p><\/li>\r\n\t<\/ol>\r\n\t<li><p><strong>Assigning attributes to products<\/strong><\/p>\r\n\t\t<ol><li><p>Open the product for which you would like to add variations to, and choose the <strong>Variable product type<\/strong>:<\/p>\r\n\t\t\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.4.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.4-300x120.jpg\" alt=\"how to add a variable product.4\" width=\"300\" height=\"120\" class=\"aligncenter size-medium wp-image-49484\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.4-300x120.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.4-150x60.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.4-1024x410.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.4.jpg 1417w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t\t<li><p>Next click the <strong>Attributes<\/strong> tab and choose your attributes, then click <strong>Add Attribute<\/strong>:<\/p>\r\n\t\t\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.5.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.5-300x110.jpg\" alt=\"how to add a variable product.5\" width=\"300\" height=\"110\" class=\"aligncenter size-medium wp-image-49485\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.5-300x110.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.5-150x55.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.5-1024x374.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.5.jpg 1397w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t\t<li><p>Check <strong>Is for variations<\/strong> and click <strong>Update<\/strong> or <strong>Publish<\/strong>. You can leave <strong>Display on product page<\/strong> unchecked, unless you want it to show up under a new tab on the single product page next to <strong>Description<\/strong>:<\/p><\/li>\r\n\t\t<\/ol>\r\n\t\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.6.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.6-300x100.jpg\" alt=\"how to add a variable product.6\" width=\"300\" height=\"100\" class=\"aligncenter size-medium wp-image-49486\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.6-300x100.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.6-150x50.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.6-1024x342.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.6.jpg 1405w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t<li><p><strong>Create variations from attributes<\/strong><\/p>\r\n\t\t<ol><li><p>Under the <strong>Variations<\/strong> tab, click <strong>Add Variation<\/strong>. Note: Your product must be published to see the <strong>Variations<\/strong> tab.<\/p><\/li>\r\n\t\t\t<li><p>Start configuring your variations. For example, let&#8217;s have <em>Any Size<\/em> at a price of 45.00. To set this variation <strong>Product Image<\/strong>, click the <strong>Product Image thumbnail<\/strong> and upload your photo, then click <strong>Insert into Post<\/strong>:<\/p>\r\n\r\n<a href=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.7.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.7-300x124.jpg\" alt=\"how to add a variable product.7\" width=\"300\" height=\"124\" class=\"aligncenter size-medium wp-image-49487\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.7-300x124.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.7-150x62.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.7-1024x424.jpg 1024w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2015\/06\/how-to-add-a-variable-product.7.jpg 1399w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t\t\t<li><p>You can continue adding your variations or if you are done, be sure to click <strong>Update<\/strong> to save the variations you have just added.<\/p><\/li>\r\n\t\t<li><p>Once you are finished, view your product to check out what you have just accomplished!<\/p><\/li><\/ol>\r\n\t<\/li>\r\n<\/ol>\r\n<p>Feel free to check the detailed video tutorial below:<\/p>\r\n\r\n<a href=\"http:\/\/www.youtube.com\/watch?v=OvF4qByuveQ?width=1280&amp;height=720\" rel=\"prettyPhoto\">Jigoshop. How to add variable product<\/a>","protected":false},"excerpt":{"rendered":"<p>This tutorial will guide you on how to add a variable product in JigoShop.<\/p>\n","protected":false},"author":67,"featured_media":49492,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1381],"tags":[1925,542,1741],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/49480"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/67"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=49480"}],"version-history":[{"count":0,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/49480\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/49492"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=49480"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=49480"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=49480"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}