Wix Online Store Tutorial (Create a Professional eCommerce site) – Digital & Physical Items



in this video I will show you everythingyou need to know to set up your firstonline store using Wix so this is atutorial for e-commerce websites usingWix which is obviously an extremelypowerful tool so many people use it tobuild their websites because it's verypowerful it's very easy and it's prettyaffordable as far as website builders goso with that in mind if you're choosingWix to build your site this video willbe a step-by-step tutorial showing youeverything you need to know all thetools all of the settings to take youfrom an absolute beginner to having afull-blown store at the end of thisvideo so with that in mind we have a lotto cover here stick around for theentire video and the first thing we wantto do is actually open up a browserI recommend Google Chrome hopefullythat's what you're watching this videoon already if not any other browserworks Google Chrome I find is a littlebetter though just because you can havesome extensions that further on down theroad might help with your website but ifyou're building it on a differentbrowser that's not a problem so what youwant to do is go down in the descriptionof this videohold down ctrl on your keyboard andclick on the link at the top of thedescription and that will open up a newtab and it should look something likewhat we're seeing right here now insteadit might have a big picture and a bigblue button in the middle click on thethe button will probably say get startedor something click on that create anaccount and it'll bring you to this pageright here now this page what we want todo is go up to the top right click onthe create new site button and we'regetting started with our site so itopens up a new tab here and asks us whattype of website we want to create now aquick disclaimer Wix from time to timemay change the first step here it mightlook slightly different but if it looksdifferent for you just stick around I'msure it'll look similar in a couplesteps down the road so what we have hereis many options we can choose businessdesigner blog we're setting up an onlinestore so it makes sense to click thatnow and what that is essentially doingis it's adding the application to ourwebsite to have an online store so it'sadding the cart the Thank You page theproducts like stuff like that is beingadded right now now if we use any otheryou know a photography layout or if weuse other layout whatever you're usingif you use those you can still add astore later on and I'll show you whereyou woulddo that but for us we're just going toclick online store make our lives alittle bit easier now the next step isto choose if we want the ADI creator orif we want the Wix website editor so theADI creator goes through a bunch ofquestions and just kind of puts yourwebsite out right away it's less it'sless customizable so you can't optimizeit quite as much but it is a lot quickernow in this video first stores if you'rebeing serious about your business Ireally recommend you go to choose atemplate with the Wix editor so we'regoing to do that in this video and itbrings you to this template page righthere now remember before I said that itdidn't really matter what you clicked onin the first step that's because all ofthose are on the left side so businessis right there photography video itdoesn't really matter you can click onany of those in the first step and itjust brings you to this makes it seemeasier it's really the same thing sofrom here what you want to do is go downand choose a template that you thinklooks good it doesn't really matterwhich one you choose obviously thepictures will all beat you can changeall the pictures all the color all thetext but choosing one that is similar towhat you want in the end will save youwork so for our purposes right here weare going to go down to this one righthere the plant we're gonna sell someyeah let's just sell some plants I guessright so let's go down and you canactually view it first to see more aboutit so it's not just a little tiny iconthere so if you go to view you can get agood experience of what it's like soscroll down you know click on things seewhat it looks like and you know what Ithink this one looks like it's a prettygood for us I like the little image inthe background at the top and yeah so ifthis is what we want you can go to editthis site or you can actually go backand choose a different one so we aregoing to edit this site I think this isa good one for our needs right here andit starts setting it up again withanother tab with the Wix website editorit may take a few minutes but you shouldend up on a page it looks something likethis now what we're going to see here isacross the top a menu bar and on theleft side all these little bubbles thatessentially allow you to customize yourwebsite a little bit more now no matterwhich template you chose there are goingto be a lot of similar features here butfor example when we go to the top leftthe first thing is your pages and itshows you all of the different pages youhavewebsite and of course this is going tobe different for everybody depending onthe template you chose but for the paidfor the template I chose we have home wehave got shop right there you haveshipping and returns you have a pageabout the privacy policy and so you canclick on any one of those pages andit'll bring you into the editor for thatpage so if you want to go and changeyour privacy policy you click on that upat the top and then down here you canclick on anything you want then you canedit the text you can move it around solet's say this one right here if we wantto change the privacy policy we canclick on edit text right there we canchange it to whatever we want so we canchange it to whatever we want and thenwithin that you can also change thetheme of it so you can change it if it'slike a header or something you canchange the font and of course adding toomany fonts will slow down your loadspeed I recommend sticking to like oneor two fonts to make things quicker andeasier to read you can change the fontsize you can do all the normal textediting here with color underliningmaking it left aligned right aligned youcan change some effects with it and alot of stuff like that now one thingthat is really useful and I point thisout a lot I'll point it out later on inthe video as well but you can go and addlinks so if you want if you want righthere this is supposed to somebody clickon that if you want that to be aclickable link you can have that textlinked to either a web address or a pagewithin your website an anchor and I'lltalk about anchors later on in the videothe top of the page the bottom of thepage so for now let's just say it linksto the top of the page for some reasonand so that's how we're going to beediting text so that is just one of themany things you can do here I'll talkmore about editing a little bit later onif you want to see it in mobile modewhich I highly recommend most traffic onthe Internet is actually on phones thesedays what you want to do is go to switchto mobile mode and while the editing isslightly more limited here it isactually a great way to at least checkit out make sure text isn't cut off movethings around and just make sure thatyour site is optimized for the mobileversion now let's go back to the desktopso switch to desktop toggle reallyeasily across the top and then goingacross here you can actually go to sitewhich is how you save it you can previewit in preview just shows you what itwould look like if youactually went to the website as long asit's unpublished you can publish it andthen actually go to the website in a newtab and that's essentially all we wantto really do right there site historyyou could really like roll it back ifyou need to so next we have settingswhich allows you to connect a domain anda domain is obviously very importantthat makes it so that your website islike Santro mediacom instead of micwix.com slash sand trail media which isobviously all over the place and veryhard to find and not a good website sowe will connect in domain I'll show youhow in a in a few minutes we can get amailbox which means get G suite on hereso if you want to be my cats AntrimMediacom it's much more professionalthan like my cat gmail.com which seemslike you're not really running a realbusiness now we go down to upgrade andupgrade of course will allow you toactually use the website with the domainand everything I just talked about butbefore we can upgrade let's go back tosite and go down and save it and whenyou save it it's going to ask you toname it choose a name for it so we'regonna say San trial store for now andthen click done now what we want to dois go back to settings go down toupgrade it'll bring us to a new tab andbecause this is an online store we haveto make sure that we're getting ane-commerce one so business ande-commerce is what we want to choose andit doesn't really matter which one youchoose read through these and selectwhichever one makes the most sense foryour business if you want 35 gigabytes50 20 gigabytesit doesn't quite matter you can doreally lots of different options hereI'm going to select business basic forthis video and then you can chooseeither yearly monthly which of coursemonthly is more expensive or three yearsso the longer your plan is the moremoney you're saving if you think you canhave a business for I mean I recommendat least one or two years I'm doingmonthly right here because I'm notactually doing this it's just for thetutorial but regardless I'm just gonnago and follow through with this and getthe monthly plan for now okay so onceyou put in your credit card and youclick Next it'll bring you to this pageright here and it says congratulationsyour site is premium which is good nowthe next thing we want to do is find adomain for our site so let's say SanTrel media apparel dot-com and saysomething that we want right there soyou go and it says it is availthe next we can say get it and honestlythis is the easiest way to do thissometimes I recommend you go and checkout so it's actually very cheap for $15a year sometimes I recommend you go andget it from Google domains because it ischeaper but there are a few extra stepsif you're interested in that I'll linkout a video in the description where youcan see how I did that in another videobut for this video let's just go and doit this way so we're going to continue$15.00 per year we're going to go downand purchase this so then it asks if youwant it to be a public or privateregistration and I recommend you do thisprivate just so people can't come toyour door and call you and have yourphone number your address and actuallyyou know try to bug you and buy yourdomain so I recommend doing private it'san extra ten dollars per year so you arepaying 25 a year which is a little bitmore expensive but I mean if it's wortha few to save the extra maybe ten ortwelve dollars you can go and do thisthrough Squarespace or through you knowGoogle domains there's a lot of otherways to do this so we're just going tocontinue with this for the purposes ofthis video though so we're going to goand submit the purchase and check outhere while we're kind of going down thisrabbit hole of upgrades here which isvery essential for your website the nextthing you could do is actually go downand buy a mailbox and it's somethingthat it should be prettyself-explanatory I'm not going to getinto that for this video we're focusingon building the website right now andalso I don't want to spend any more ofmy money on this video I respect likefifty dollars there but regardless let'sgo back to our website here and actuallycontinue building it so once we have itupgraded let's go and refresh this siteright here our website builder so wehave a domain as you can see right herewe are done with that so let's close outand go back to our website now it's notpublished yet and it doesn't have to bepublished you can keep saving it as youedit and then publish when you're doneor you can publish it right nowrealistically not many people will beseeing it in the beginning so maybe youwant to publish it and then you can goback and see what it looks like ondifferent monitor is different maybedifferent phones different devices it'ssomething that I recommend just to makesure that it looks good on all thedifferent devices you have so up toplet's make sure that we save this stillsaved and let's continue going acrossthe top so right there you can see thistime that it actually did save it as ourdomain which is good that's exactly whatwe wantedso settings you can get found on Googleand stuff like that that's all moreadvanced stuff that I'm not going tocover in this videothe tools are essentially what you'reseeing so like this little thing righthere tools on the left side so ifanything's missing just go up here andcheck it out and maybe add the rulerruler is a good way to make sure that ifyou want to make sure something centeredaround a third it's pretty easy to go uphere and just click on that and drop aline and move it around so you can findout so if this is like 980 pixels wideas I think it is you can move it to themiddle and say like 400what is that 490 pixels would be abouthalfway so you can move this to 490 andyou can snap things on to the centerright there it's something that doesmake it easier when you're trying tobuild your website and likewise you cando it this way and have things line upusing these little bars now if you don'twant one you just click on it and clickdelete pretty easily pretty pretty easyto do so just click on it click thelittle trash can and it goes away youcan go to dev mode again we're not doingthat in this video we can go to help andwe can go to upgrade which we alreadyupgraded if you need a bigger site ormore storage you can upgrade evenfurther so that's everything across thetop when you go here you can hire a Wixpartner again not really that importantso going up to the top right then wehave zoom out and reorder we have undoredo save preview and publish I talkedabout save preview and publish alreadybut zoom out and reorder is verypowerful early on in your website whenyou're trying to figure out the generalstructure of it the Wix usually buildswebsites with a kind of a stripe layoutso what they do if they have thesesections these blocks that you seethey're highlighted in blue and they allkind of do something different and it'skind of a nice layout but if you want toreorder them you can go and move thisone down and so you can just keep movingit down move it wherever you want to andyou can actually delete them if youdon't want the section you can duplicatethe section or if you need extra spacebetween sections so say you want to addlike some extra pictures in there orsomething you can actually go and clickon the thick blue bar right there anddrag that down so that you end up withmore of that gray space or whatever thebackground color is right there so whenwe're done with that click on the X upon the green thing on the top and itbrings us back to our website editor sothat's everything Italk about across the top now let's getin and actually start building this as astore so before we go in and change thelogo and stuff like that I just want togo down to my store here and startshowing you guys where you can addproducts now if we go and click on mystore it says welcome to my store getstarted and it's going to kind of walkyou through how to add different thingsso we're going to go to the dashboardright there is what it wants you to doyou can add products you can see yourstore pages right here we have fourstore pages so we have shop which islike your main page which shows all ofyour products so think of it as like ifyou go to Walmart calm and you're justscrolling through that that is shop it'sgoing to look like that with all of yourproducts the product page is going to bethe individual product that you'relooking at so how they're laid out whenyou click on a product you want yourlogo at the top do you not get into thatlater on as well cart page isself-explanatory and then the Thank Youpage after somebody makes a purchase soyou can go down and add store elementsso if you want to have like a differenttype of gallery if you want it to be acarousel if you want like a slider rightthere if you want a big product widgetthere's a lot of different ways you canhave these little store elements rightthere and you can add those into yourwebsite and then lastly learn learn moreis something that it's a good resourceif you want to see more about like findthe support forum and stuff like thatbut for our purposes we are reallylooking at the top three right here solet's go and add some products and whatwe want to do it'll bring you to a pagethat looks like this and says what areyour products so the first product wewant let's just say San Trail t-shirtand we can go and add images of this oryou can add videos I recommend for somephysical products or actually or digitalproducts either one having a video it'sactually pretty nice so let's go downand upload media here so we can go andit gives you all these options you canfind it from Google Drive from Facebookpretty much everywhere you want so weare going to upload it from my computerright now and we are going to selectthis shirt right here the just t-shirtthat I kind of just threw together rightthere and says I love central media soit's not actually for sale this is notreal kind but there it is so that is ourfirst product we're going to addthere's product right there that's thefirst picture obviously have morepictures not just one but for ourpurposes let's choose one and so you canchoose if you want it to be yeah let'ssay this is a new arrival new arrival wecan change a price for it so let's justsay $15 for this we can put it on salefor maybe a discount would be like 20%off 20% so let's say maybe originally itwas like 20 bucks it's on sale for 16something that a lot of people like todo is mark things up make them on saleobviously everyone's discretion choosewhatever you want to do for that andthen write your description right hereso let's just say awesome sanchowt-shirt and you should probably beefthat up a little bit more than that butregardless let's go down and you can goand add additional info right there suchas your return policy maybe somethingabout the sizing you can go down and addsome custom text fields and we can godown and also add some other productoptions so this could be like the colorso let's just say color and the color wecould have a list and so we could haveblue white or we could have and weshould make that capital and so that'show you get your different sizes or yourdifferent colors so there's a drop-downmenu right there and so we could managethe pricing and inventory based on thedifferent colors assuming we haveinfinite inventory and assuming we don'treally care about the pricing betweencolors I'm just going to leave that asit is right now so you can trackinventory so you can tell it how manyyou have of each color and it's a greatway if you have multiple products to useWix to track things and let you knowwhen you're running low for me I'm notgoing to do that in this video butregardless it's something that is veryeasy to do and is a very useful tool soright up there you can choose whichcollection you want this in so let'screate a new collection and call thiscentral central apparel and we're goingto make a new collection right there andthen you can go down and promote it bycreating different discounts promovideos you can send an email campaignand you can editthe SEO settings of this so let's makesure we save the changes of this andcontinue and this will actually so setupyou shipping regions we're not going toworry about shipping regions right nowso over here the SEO settings allows youto be found on Google so SEO is searchengine optimization so making sure thatthis is something that Google can findwhen somebody looks up San trial t-shirtyou want to make sure that they'refinding your product these Santrot-shirts so we want to make sure thatthe URL slug is what you want so likeyou know whatever central media apparelcomm slash product slash San Pharrellt-shirt and that's what we want rightthere and then it's gonna pop up thetitle is going to be that and then thatis going to be our description populatethese with as many relevant keywords aspossible so that you rank higher inGoogle for your own product and this issomething that's actually especially bigas Google's starting to be more and morelike their end goal I think is to be alittle bit more like Amazon where youcan go to search things on Google andfind the products right there and buythem so having this ready for SEO meansthat you will find more traffic not justthrough social media or wherever yourmarketing but also through Google withorganic search so once we have thisright here let's go up and save and thatis our first product right there firstproduct is ready to go and we can havemany other products down here you canadd new products like I said so we canactually rearrange the order of theproducts but let's just say those arethe products we have right now I'mselling a San trial t-shirt and a wholebunch of other things and again you canhave discounts right there it's in stockyou can track the inventory you can havea skew right there and you can choose ifit's a physical or a digital product solet's right now actually add one that isa digital product so if you want adigital product something people mightbe selling like video courses ebooks umsomething like that let's just do thatright now so if we want to upload a fileyou can actually go if it's an audiofile a document a zip file let's uploada document right now so upload the mediafrom my laptop right here and let's justupload this PDF right here so it's goingto upload it and if you want to give outa like a free PDF for example let's justgo in there make sure it's a free pdfright there so add to product we addedthe file right thereyou can change it and let's just sayfree we're gonna call this one free andwe're gonna call it free YouTube sorryYouTube success blueprint and we'regoing to say that price is zero dollarsright now so people can you know justadd it to their cart download it theyget this free you know PDF and let's goand save this right now and the nextthing is you can see on the top is it isprompting us to add a payment method andthis is something that you obviouslyhave to do if you're selling things onyour store which if it's a store I hopeyou are and you can go there and acceptthings with PayPal or with Wix creditcard debit card whatever so we're goingto connect actually h's use not PayPalfor now let's just use that so it'sgoing to be connecting the paymentmethods and it'll tell you then thatyou're ready to go so you can acceptdebit cards and you can set up theregions you're willing to ship to againthat popped up right there and issuggesting it kind of walks you througha lot of stuff Wix it usually tells youlike hey do you want to do you want todo this is probably the next thing thatyou should be doing so we are going tonot ship internationally just domesticfor the purposes of I don't know we'reselling this t-shirt maybe we're surfingwith the US Postal Service right so thatis what we're going to be doing rightthere and let's just X out of this thenit'll bring us back to our page here andso right there we saw that we had ourproducts store pages here so we havefour different pages you can add anotherstore page if you want typically whenyou go to the store template I find thatfour is good enough for my needs forbasic ecommerce stores you can add otherones and so you can just click Add rightthere you can rename it so click thelittle three dots right there you can goto settings and this is where you canrename what that page is and kind ofbasically for any page if you go up tothe top and click on that you can changeany page in the same way we can renameit you can choose if it's on your menuso you can hide it from the menu on thetop the menu being like up here it'shidden right now though then we can alsoset it as your home page if you wantthose layouts if you do or do not want aheader and the footer so the headerbeing the thing that says call us nowthe footer probably says somethingsimilar you can go down to over topermissions and you can say it's amembers-only page which is a great wayif you're trying to kind of build anemail list and you want to have peoplesign up for your email and get like afree PDF you can make it a Members Onlypage so they set up an account with yoursite and you get you know a contact listso you can send out notifications tothem then you can also go to you knowSEO on Google right here which is alsowhat I showed you before which is youknow you can change the URL slug andthings like that to make sure that yourpage is optimized for Google so withthat being said that's essentially howyou're going to do the store side ofthings adding products but how do weactually manage what the site looks likeso if we go back up to the top and clickon this and let's just go to home fornow and we're going to kind of optimizewhat this looks like so on the left sideyou have some different options here sowe talked about menus and pages this isgoing to be actually we talked about itat the top this is the same thing exceptthis gives you more options so you godown to site menu here and it shows youall the different pages you have andagain you can reorder them move themwherever you want add pages delete pagesand then if you click on the three dotsthis can also let you either optimize itfor Google you can copy it you canduplicate it like I said you can hide ityou can make it a sub page lots ofdifferent options I recommend I meaneveryone has different needs so messingaround with that a little bit and seewhat actually works best for you now aswe go down you have member pages memberssign up right here so when members aresigning up for your site what is thatactually going to be like for them soyou can say the member signup form youcan change this you can optimize it oryou can just leave it as it is socontinuing down the options on the leftside then we have right here the pagebackground if you chose a good templateyou probably don't need to change thepage background you can go down to adddifferent things right here so there areso many different things you can add inWix and it's all drag-and-drop very easyto resize things change the angle thelocation of them and you can add textlike you see right here all thesedifferent texts images and the imagescan be things that you upload some freeWix clipart free Wix images stock imagesstuff from Facebook lots of options forwhere to get your yourthen you can add a gallery if you wantto have an array of images you can addvector art you can add shapesinteractive actually go back to shapesif you want like a line anywhere theyconsider that a shape so going to shapesand add lines if you want you can haveinteractive things where it's like aslideshow for example or things that youhover over you know you can add buttonswhich is essentially a picture with textin it that links out so let's just add abutton right now buttons are somethingthat I add all over my websites and solet's just say we want this button to beI don't know like don't want to clickand drag everything so let's just saythat we want this button where does ourbutton go there it is okay so let's justsay we want this button right here to bea lot larger so we can go and make thissignificantly bigger and we can changethe text of it we can change where itlinks to so if we want this to link toan anchor for example we can add ananchor somewhere on the page and ananchor means when they click on it itScrolls to a certain section so if youhave like an FAQ page this is a greatway to use anchors where you have allthe different questions at the top andeach one links out to a paragraph belowthat shows you what it is so we're goingto say done and if you want to add ananchor go back over to add so you'relinking to an anchor here the anchor youwant to link to you can find these overon the left side then so going down wehave box right there which is also ashape basically you can add an entirestrip I showed you before how you canrearrange the strips this is how you addnew strips and there's so many differentoptions for what type of strip it is andthey kind of come you know pre formattedfor essentially what you're looking forlists and grids you can add video youcan add music you can add social so Irecommend adding social somewhere onhere social is a huge aspect of websitesthese days you can add contact formswhich gives people these fields they cantype in click Submit and then it'll sendit to you this is a great way if you'rehaving maybe like support or if you'retrying to get more leads on somethingit's a great way to do that you havemenu right hereyou can add a lightbox and the lightboxis just something that pops up whensomeone's on your website and says likehey did you know we're running a saletoday or sign up for our email list oryou know different options for what'sgoing to pop up in your lightbox then wecan go down to we can start a blog youcan start a store we already have astore obviously you can start bookingsyou can set up you know members and moreand here when you go to more is where Isaid you can find anchors anchors areright here and if you want an anchor youjust click and drag it and you can putit wherever you want on the page and soif we put an anchor right there thenthis button we could link to the anchorwhich means it's going to scroll untilthat anchor is lined up with the top ofthis screen so definitely try this outthough once you put it in there makesure it actually works and Scrolls tothe right location because you don'twant a website that is going to scrolllike halfway through the paragraph andjust looks very unprofessional so goingback to add here let's just continue andjust finish out the other things you canadd because there really is a lot rightthere so you can add a chat in thebottom left you see that we have that alittle brown box there you can addevents you can add play buttons paypower sorry pay buttons sorry GoogleMaps and document buttons so just lotsof other stuff to add there and then ifwe go down to the next option here thisis the Wix app market so if you rememberin the very beginning of this video Isaid it didn't matter if you chose onethat was not a store that's because ifyou chose one that was photography forexample it wouldn't have a store builtin as a page already but you can go inhere and add a store app so thesedifferent apps are going to allow you todo things like the store where it's allintegrated has a check out a cart athank-you page and so you can do all ofthat within here or you can add otherthings some other free apps onlinestores photography like just go throughthis there are hundreds of differentapps you can get and they're all made bya lot of them are made by Wix whichmeans they're extremely powerful andthey're very well integrated with yourwebsite so continuing down you havemedia which is going to be anything youupload it so documents and pictures thatyou uploaded maybe if you want themsomewhere on your page you just want toadd more media or whatever when we godown to start a blog that's somethingthat a lot of stores have blogs thesedays maybe you can add it if you wantyou don't necessarily need one and againwe can go down and see our store sothat is a lot of what we're doing hereof course when you're trying to messaround with different things I recommendgoing into each different elementindividually click on it it should befairly self-explanatory so if we go toour home page here you'll see that likeadding a logo at the top right there itis a button you can change the text ofit you can make itadd your add your image up there in theheader and make sure it links to homethat's something that a lot of peoplemiss out on I don't know why peopleforget to do that the top left shouldalways link to home if it's your logowell let's just say right here if thisis our they actually put text there Iwould recommend maybe like an image foryour logo but if you want to like rotatethis you just click on the top left androtate you can resize it you can move itaround and ultimately you want to makesure that everything kind of staysbetween the two dotted lines you see onthe left here so right there and rightthere that's something that Wixrecommends so it looks good on differentaspect ratios of phones or laptops orold computers or TVs projectors younever know where somebody will belooking at your website and you want itto look goodon all of them so guys that's what Ihave to say in this video I know thiswas a pretty lengthy video but hopefullythat gave you a pretty in-depth tutorialand showed you what you need to know toset up a store using Wix now the nextstep for you right now is obviously togo through and populate this and do whatI showed you in this video so add yourlogo add the text everywhere filleverything out add your products andthen by the end the last thing you do isgo up and click publish so that yoursite is ready to go and people can startbuying now of course I also recommendyou go through and actually followthrough on your own website on maybe anew tab or on a different laptop andactually go through and kind of followthe user experience go through checkoutmake sure you don't have any brokenlinks or broken pages so that whensomebody is using your site it's smoothseamless and it works perfectly wheneverthey're trying to buy your product soguys I hope this video helped you if itdid please remember to like andsubscribe as always thank you all forwatching I'll see you next time

Source