How to Add a Variable Product to Your Ecommerce Website



Hi guys today we are going to see how we
can add a variable productto your e-commerce sitenow let's say you have a
product which comes in differentvariations like thisso here is a t-shirt which comes
in different colors and sizesor let's say you have a food
product which comes in different flavors like thisso if you want to create
different variations on your products like thisyou need to create a variable
productso once you create your variable productyour customers will be able to
choose the option they wantbefore purchasing your productso let's get started we are going create
our variable in just four stepsthe first step is to create your attributesso attribute are the differences which
you have on your productfor example if your product comes in
different colorsyou need to create an attribute called colorso to create the
color attributelet's go to our WordPress dashboardand then go to productsand click attributesnow you'll get this page where we are
going to create the attributenow if you have any default attribute hereyou can delete itby clicking deleteso once you have deleted the default attributeyou can now create a new
attributeso let's say you want to have different color options on your productthen all you have to do is enter the attribute namewhich is colorand then click Add attributeso once you have added
the attribute namenext you need to add all the optionswhich you want inside the color
attributeso let's click on colornow let's say you have three colors
on your productyou just have to enter the
colors hereand then click add new colorand it'll be added herenow let's add
all the remaining colorsnow once you've added all the colorsnow if you go back
by clicking hereyou can see that
we have the color attributewith three different colorsso now we have successfully
created our attributeso once you've created the
attributewe can now go to step twowhich is to add this attribute to your
productnow to add this attribute to our productjust go to newand then click productnow enter your product nameI'm going to enter t-shirtnow if you see here right now this
product is set to a simple productwhich means we cannot
add our attribute herenow if you want to add your
attribute to this productyou need to
first change this to a variable productso to change it let's click hereand then select variable productso once you have
selected variable productproduct we can now add our attribute to
this productso to add the attribute to this productlet's go to attributesand now if we click hereyou can see the color attribute which we
created beforeso let's select thatand let's add it to the productnow here you need to choose the colors
which are available for this productso if we click hereyou can see the colors
which we added beforeso let's select a colornow if you want to select all colorsjust click select alland all the colors will be selectedso once you have selected the colors
which are available for this productjust enable used for variationsand then click save attributesso now we have successfully added the
attribute to a productso once you add the attributenext let's
go to step 3which is to create your variationsso to create variations on your productjust like variationsand then click hereand choose create variations from all
attributesnow this will create
different variations for your productbased on the attributes you selectedso let's click goand now you can see that three different
variations have been added to our productand each of these variationshave a different colorso now we have successfully created our
product variationsso next let's go to
step fourwhich is to set the price for
these variationsnow to set the same price for all the
variantsjust click herethen select set regular pricesand click gonow it will ask you to enter the priceso I'm going to enter 299and click okayand now the price will be set for all
the variationsokay so now we have successfully set the
price for our variationswhich means we can
now publish our productnow before we publish our productlet's add an image for our productso to add a product image
just click set product imageand in drag and drop an image
from your computerso once you've set the product image
just click publishand we can now see the productby clicking herenow here you can see that we now have
the option to choose the color of a productso if we click hereyou can see all the colors which we
selectedso this is how we can add a variable
product to your e-commerce siteso once you have added these variationsnext let's see how we can
change the image for each variationnow if you click hereand choose a coloryou can see that the
image does not changenow if you want the image
to change based on the color you chooseyou need to set an image for each
variationso to set the image for the variationjust go back to edit pageand then click variationsnow these are the variations which we
created beforenow to add an image for this variationjust click on itand then click here to add an imagea drag and drop an image from your
computerand image will be set for this variationnow in the same way we'll add images for
these two variationsso we'll click hereadd the imageand then add image for this oneso once you have added the imagesjust click Save Changesand then click updateso now if we go to our productand then click refreshnow if you select a coloryou can see that the image changesbased on the color we chooseso this is how we can set an image for
your product variationsso now you know how you can set the
image for each variationnow here you can see that we have the
same price for all variationsnow what if you want to have a different
price for each variationit's very simpleso next let's see how we can set
different prices for your variationsso to set different prices for each variationjust go back to your product pageand then go to variationsnow let's say you want to
change the price for this variationjust click on itselect the priceand then enter the new price hereso once you've set the pricejust click updateand now if you go to our productand click refreshyou can see that we now have a price rangenow if we click hereand then select this variationyou can see that it has a price which we
selectedokay so this is how we can
set a different price for your variationsso now you know how you can
add one set of variation to your productbut what if you want to add
another set of variation to your productlike thisIt's very easyso let's go to the second part of this tutorialwhere we see how
we can add a second variation to your productso to add another variation
first let's create the attributeso to create the attributejust go to attributesand now I'm going to create a size
attributeso let's enter thatand then click Addnow let's click sizeand now we need to add all the options
we want inside the size attributeso I'm going to enter the first size hereand click Addand it'll be added herenow let's add all the remaining sizesso once you have added all the items you
want inside the attributejust go back by clicking hereand now we have created the size attributeso once you created your
attribute you can now add it to your productso let's go to productsand then open the same productand then click attributesnow click hereand in select the new attributewhich is sizeand click addnow here you can select the sizes
which are available for this productso iam gonna
click select all to select all the sizesand then enable this optionand click save attributesokay so now we have added the size
attribute to our productso once you've added the attributenext let's create the variations
based on these new attributesso let's click variationsand here you can see that we have the
variations which we created for the color attributenow to create the variations for both color and size attributewe need to
first delete these variationsso to delete these variationsjust click hereand then select delete all variationsthen click goand now all the variations
which we created before will be deletedand now
we can create the variationsbased on our new attributesso to create the variation let's click hereand then select create variation from all attributesand click gonow as you can see the variations have
been created using both of our attributesnow once you created these
variationsnext you need to add the pricefor all of your variationsso to add the price just click hereand then select set regular pricesand click gonow enter the price hereand click okayso now we have set the price for all of
these variationsnow to save the changeslet's click updateand now if we go to our productand click refreshcan see that we have two options for our productswe can now choose the product colorand the products sizeso this is how we can add multiple
variations to your productsso now you know how we can create these
variations on your productnow instead of choosing from this drop-down menuwhat if you want to display your variations like thisnow these buttons
will give your customersan easier way to choose their optionso if you want to
add buttons like these to your variationsyou need to do four stepsthe first step is to install a plugin in WordPressso to install the plugin let's go to our WordPress dashboardand then go to pluginsand click add newnow search for a plug-in called
variation swatchesand you will get this pluginnow just click installand click activateokay so now the plug-in is installedwhich means we can now go to step twowhich is to choose the type of button
you wantso to choose your button typelets go to productsand click attributesnow first we'll choose the type for the
color attributeso let's go hereand then click Editand now you'll get this option called typenow as we want to show colors on our buttonsI'm going to select the type
as colorso let's click hereand then select colornow click update to save
the changesso now we have set our button typeand now if we go to our products pageand click refreshyou can see that we now have buttons for
the color optionbut these buttons do not have any colorso let's go to step three which is toset the color of these buttonsso to set the colors for the buttonslet's go back to wordpressand then go back to attributesnow let's go inside colorand here you can see all the colors
which we added beforenow to set the
color for this buttonlet's click on the colorand then click select colorand choose your colornow let's click updateand then go backand do the same for
these two colorsso we'll click hereset the colorand click updateso once you have set the colorsnow if you go back
to your productand click refreshyou can see that we now have the colorsso now we have set the colors for these buttonsso next let's go to the final
step which is to create the buttons for the size optionso to create the buttons for the size optionjust go back to attributesand then go to sizeand click Editnow just click hereand select the type as buttonnow if we click updateand then go hereand to refresh the pageyou can see that we have now got the
buttons for the size variationso now you can choose your option by
clicking on these buttonswe add this product to our cartyou can see that we now have the options we selectedso that's it guys this is how you can create variationsfor your product on
your ecommerce sitenow if we go to your storeyou can see that right now your products
are displayed like thisbut if you want to display your products
in this waywhere your customer can choose their
variation directly from the store pageand then add it to their cartyou can do that by getting
the premium version of the pluginwhich is given in
the link below this videoso this plugin also has a quick view
optionlets you view the product without
leaving the pageso that's it guys this is how you can
add a variable product to youre-commerce website now if you don't have
an e-commerce site you can watch thisvideo to see how you can create your
e-commerce site so next if you want toget a domain and hosting for your
website you can click here to get domainand hostingso thanks for watching I'll see you in
the next video bye bye

Source