how to show multiple products on one product page on shopify

what's up everybody welcome to a new,video today we're going to be answering,one of the questions here on the one,product store setup i was supposed to,continue the series today and finish up,all the uh i guess you could say the,minutia the smaller details like the,newsletter and things like that but we,have a question on the one product store,so we're gonna tackle that question,first and then maybe tomorrow we'll jump,into the video where we finish uh the,quick series uh for those who don't know,we basically built a store in literally,20 minutes and this is kind of how it,looks,the only thing we didn't do is like the,upsell we didn't do the newsletter uh we,didn't do all that and that would be,once again tomorrow,but the question that i got was from,uh,exectica sorry if uh sorry if i don't,know how to spell or read your name,but he says hey my question is that i,have a one product i have one product,but with a lot of different colors and i,want to make each one separate a,separate product to put on my front page,how would i do that and um,here i asked him so what like you have a,bunch of different variations and he,says yeah basically has different,variations for the product but he wants,them to be kind of separate and so this,is uh completely possible and just,remember that creativity will reign,supreme so let's go ahead and jump into,editing the store so you guys can see,what i did here so prior to,getting this comment the idea was just,creating the store based on one product,with no variations right,other than size of course as you guys,could see that was kind of the only,concept,but until we got the question,i thought well how can we actually,structure this idea if we have different,colors and different variations for the,product that kind of make it in a way,the same product but yet different how,can we showcase that how can we show,that to the consumer base uh it's,actually not that hard so,for this section right here this is,ideal for the sale part of the product,right so what we're going to do is we're,actually going to have to get rid of,that before we do that,we have to add the products right so i,added a quick few variations right here,so we have this variation this variation,in this variation for the product let's,just make sure they're all active so,just select them all here make sure we,go here and set as active,and then we'll just also make sure,that we don't have to worry about the,stock,for them so let's just go over here to,edit products,and i don't want to kind of worry about,the stock counters,uh for the sake of the video so let's,just go over here to,um,uh let's see here inventory quantity,and anything that's zero for these top,three,let's just go ahead and change that to a,one,and that's it all right so now,essentially every product is in stock,except for the original main product,size 13,size 11 and remember i did that for a,reason so i could show kind of the,notifying feature right so you see that,little animation at the x here and then,just enter the email to be notified when,the product goes out of stock,but let's just go ahead and edit the,home page and i'll show you guys what i,would do in this case if i did have,different variations,for my shopify product and this is,actually pretty normal what people do is,they tend to outgrow the one product,that they're selling and they start to,change things,so what would really happen in this case,is there's a section here within the,theme this is the the motto shopify,theme guys for those who don't know um,you'd go to,oneproducttheme.themotto.com to get the,theme they have a lot of stuff uh where,they talk about the theme but basically,it's pretty simple if you want to order,it you literally just click order now,and it will essentially take you to the,cart page uh where you get to pay for it,this is just like when they're,advertising pages they're landing pages,you know every kind of website has this,where they describe the benefits,of the theme all right so,let's just hop over here okay yeah here,it is this is the cart page,so it's already added also guys keep in,mind they have a coupon use code summer,to get 10 off so you just type in summer,here hit apply coupon and you get 10 off,your order uh but anyways back to what i,was saying here,the theme that we're using we have a,little bit of flexibility here this is a,one product store theme guys,i don't know of any stores that are out,there that are exclusively one product,store themes,i've done my research a lot of them are,built specifically for uh you know,building a brand building many products,selling many products,but this one product store theme is,originally designed for,one product stores and so if you do have,many variations uh like the you know the,comment said this is kind of what i,would do so first thing i would do is i,would kind of take this away this is the,main aspect i would kind of take this,away unless this is well here's the,thing you have an option you can keep,this area let's just go ahead and,refresh this you can keep this top,banner for the product uh focal point,but and you can add the variations here,however most people,i mean you could do that it's optional,it's it's really how you want to set it,up but i'm just gonna make it disappear,for now now what i'm going to do,is i want to add some,top uh pixels so so like some distance,here because this thing is really high,up so instead of 100 pixels let's go,with,300 or 400 all right so we got some,space just so i can see what i'm doing,here the next thing i'm going to do is,i'm going to go to this product slider,the model product slider and i'm going,to actually select the products now i,might not have an upsell section so let,me head over here to the documentation,let's click on documentation i know they,have an article here on upsellers the,model one product store documentation,uh let's see your upseller feature okay,so basically what this feature is is,you're gonna have to name it upsell so,you go to the product and you tag it,call it upsell all right and then it,will supposedly show up so let's go,ahead and get started so let's head over,to our products let's go to products,here,and let's just add these three products,that are not the main product,as an upsell in your case you're gonna,have all of them equal in the same boat,in the same category right um and we're,going to just uh let's see if there's an,add tag option there,there is so we're going to call it just,upsell,just like the way the documentation,tells us so the documentation what does,it say here it shows literally no,no caps no spaces through the word just,literally the word upsell let's go ahead,and hit save here,let's i clicked add product but we don't,need to do that,now let's go to collections,so select the product and then hit,collections and then create the actual,upsell collection,all right,so,for me,i'm going to have to call it upsell,because when i i want when somebody to,add a product to their cart i want,and i'll kind of show you what i'm,talking about here when you add a,product to the cart i want the section,right here to show the related products,so let's go back,and let's hit manual here,or let's go back and uh yeah let's hit,manual,and,we'll have to select what products we,want in there,so let's hit browse and let's select the,three products that have the upsell tags,and let's go back,let's go to collections,and there's a chance i could do this,wrong but,let's just see what we got going on here,so,let's open up our product slider once,again let's go to edit collection or not,edit collection let's go to change and,let's select,whatever collection is existing so all,right so it's already selected,um,so let's just go back up here,and scroll up or let's make it visible,rather that's kind of my mistake and,there we go it's visible so,this is like really enlarged right now,but let me just hit save and we'll,reload and kind of wait for it to update,itself,and there you go so it's kind of regular,size now so basically what i would do in,your case is i would just take these,products here and i would just drag it,all the way to the top that's all i,would do really and of course we can,give us some some spacing at the top so,instead of 30 pixels we could do 300 and,see how that looks,right and hit save once again it's,enlarged so we just want to make it a,little bit smaller,and there it is so notice the first,thing that they hit where that they see,is this now you probably might want to,move this up a little bit more,so when you're you're creating multiple,products for your for your one product,store if you want like different,variations or you want the variations to,be visible this is kind of the best way,to go right and you want to kind of set,it up as a um,as a as a carousel in a way uh you could,set it up as a grid also but since this,is a benefit for us we have a a product,slider this is what we're going to do so,essentially this will be the main focal,point for the purchase right,and,what will happen is we can even add this,under and we can select any kind of,color any kind of version anything like,that right here like something that,might sell the most and you'd actually,want to test it you'd want to see which,version out of all these sell the most,and you want to put up here,and then after that you could just,literally show the products in different,colors here in the product features in,the news in the in the talk about the,brand images,the same way right in the uh in the um,instagram gallery,show the different images of the,different products the different colors,you know it doesn't always have to be,just necessarily one product remember,that one product stores the framework of,a one product store is built off of a,multi-product store the only difference,is it gives focus to one main product in,your case since you have different,variations let's just say colors so for,example these sneakers they're literally,all the same they're the jordan 4 the,only difference is the colors are,different right we have an all we have a,yellow and white one we have a blue one,we have a whatever color this is we have,like a brown one or a tan one,you're just showcasing the differences,here and consumers can go ahead and,click add to cart right and when they,add to cart guess what they have,the upsells in the bottom here and and,this is important because when you have,multiple products like this,you want to encourage the idea of,multiple orders and multiple or excuse,me not multiple orders but multiple,different products in a single order and,what that will do in return is it will,increase your average order value right,because it just obviously makes sense,right like if i buy this product i say,oh i like this one size 11 is not,available let me go ahead and buy size,12 i click add to my cart well guess,what now i have three different options,here,and this is just one step away from,increasing your average order value,right even if it doesn't work it's,perfectly fine still has the chance to,increase your order value um and here,is an incentivization so basically what,you're saying is if if the order is over,x amount,right you want to give them free,shipping now in my case,um,or in your case rather what you want to,do is you want to give free shipping,when two products are more ordered right,because that will help increase your,average order value um because let's say,so for example um this is a bad idea,because the prices are so high like it,doesn't work logically if the prices are,so high if a consumer is going to be,willing to pay fourteen hundred dollars,for a pair of sneakers they don't care,about free shipping that's just in,general kind of the concept but um think,about it this way if let's say the,product was fifty dollars sixty dollars,what you wanna do is you wanna set free,shipping at let's say a hundred,right because or or even let's say,seventy dollars because that would mean,that they would have to add two products,to their cart,to get the free shipping and that would,be a motivator for them and here we have,a little thing that says congratulations,you got free shipping if i didn't have,this product added to the cart right we,have these four links which i'll tell,you how to change in the future and i'll,show you guys how to do,but i want to just for the sake of the,video you guys know that 400,is the number to get free shipping i'm,gonna change one of the products um,pricing just to kind of show you how,this works,and so let's just change it to,let's just change it to 300 for example,and i'll show you why it incentivizes,people so,it's saved let's head over back to our,store here hit customize,get rid of this link,let's go to our cart,and let's just get rid of this obviously,let's just make sure that we we have the,right pricing here,maybe i forgot to save the pricing yeah,there we go so it's updated 300. so if i,click add to cart now look what it says,it says free shipping above of above,orders of 400,spend 100 to get free shipping right and,shows here where 75 of the way there so,what we're going to need to do is we're,going to need to add a product to the,cart and obviously in your case i doubt,that you're going to have a 1400 product,obviously unless you're doing high,ticket drop shipping which is a,different story uh but here it says free,shipping above orders over above 400.,congratulations you got free shipping,and here's the order total and then what,that does is you have a one-click,checkout whether it's on the on the,pop-up here or even,on your cart like if consumers decide,they want to keep looking then they,decide they want to check out they have,the checkout button right there but,that's really what i would do if i have,multiple variations for a one product,store product,or a single product store,i would,cut take the upseller right i i would,obviously rename it i wouldn't call it,the upseller i think that's logical but,i would have multiple of the those,products in a slider which the motto,gives you that option right the only,reason we don't see the slider here is,because there's three of them i could,just show you guys how it works uh for,the fourth one so let's go to products,let's go to collections and i'll,literally just add,the,the fourth product to the upsell just so,i can show you guys how it works,just like this and hit,the online store,and go back here and hit select the,customize button,and you can see here kind of that's how,it looks now a little word of advice is,you want all your images to follow the,same format,just to look a little bit cleaner right,just to look a little cleaner for so for,example if this sneaker is this size you,want this one to be the same size you,want them to follow the same direction,all that kind of stuff just make it look,clean right,but you can see here it is a slider,that's kind of what i was trying to say,here so consumers can kind of sift,through and see what they're getting and,um,you know you could change like you know,the scroll bar you could show that let,me just go ahead and save,you could show navigation right let me,just,save that wait for it to reload uh,there's all these different settings you,know but in general you guys kind of get,the idea now once again it's gonna look,cleaner if,all the product images are the same,right it doesn't look clean right now,because they're not but um you know take,your flagship product put it right under,here or you could even move it down a,little bit more the you know doesn't,really matter you can even duplicate,certain sections like this show off,different colors of the product you know,i wouldn't be,uh afraid to do that if i were you i,think there's really nothing wrong with,that so this gallery here where you get,to give descriptions of the product,images where when somebody kind of takes,their mouse and hovers over and zooms in,this section right here is also,beneficial show the different products,in the different variations the,galleries uh do that as well here's the,lookbook um you know all these different,kind of features and the thing that i,would do is also like if you know,i in the image here like i would call it,uh you know instead of like like if,you're going to showcase one product,here,a certain product of a certain color,certain variation just kind of label it,like our you know highest seller our,biggest seller something like that and,that will kind of intrigue people,another strategy is if you do have a,product that's kind of lacking in sales,or people just don't like that color you,can also showcase it here whether it is,via the lookbook right which is right,here or the shoppable product section,here and that could potentially increase,conversion rates because of the rules of,friction,friction is essentially when you make it,or less friction is when you make it,less hard for the consumer to hit the,add to cart button and check out the,instagram gallery like i said follows,the exact same pathway follows the same,rules you want to put the different,variations the colors make it visible,for people make people want to click on,them take a look at them right all that,kind of cool stuff the blogs if you are,a blogger and you want to share some,information about the blogs showcase,that all through the one product store,remember guys that just because you have,a one product store doesn't mean that,you necessarily have to,share only one product right the these,products these businesses they still,have a catalog feature right they still,have you know you can't really break the,rules of shopify there are certain,things that are just going to exist,i mean unless you remove it obviously,but that's you know different um but,remember that at one product store the,main focus is creating the home page as,the official landing page of the,products to not only intrigue,but to achieve the sale that's really,the goals of that so that's all for this,video i'll talk to you guys later thank,you guys for watching peace out bye

Congratulation! You bave finally finished reading how to show multiple products on one product page on shopify and believe you bave enougb understending how to show multiple products on one product page on shopify

Come on and read the rest of the article!