how to add a product page on shopify

Shopify Product Page Tutorial 2023 (Step-by-Step) so later in the video i'm also going to,show you h

Metics Media X

Updated on Jan 16,2023

Shopify Product Page Tutorial 2023 (Step-by-Step)

The above is a brief introduction to how to add a product page on shopify

Let's move on to the first section of how to add a product page on shopify

Let TThunt's experts help you find the best TikTok product on your Shopify business!

Find TikTok products (It's Free)
No difficulty
No complicated process
Find winning products
3.5K Ratings


TThunt has the world's largest selection of TikTok products to choose from, and each product has a large number of advertising materials, so you can choose advertising materials for TikTok ads or Facebook ads without any hassle.

how to add a product page on shopify catalogs

Shopify Product Page Tutorial 2023 (Step-by-Step)

so later in the video i'm also going to,show you how to create a simple logo,very quickly for your brand name but for,now let's move on with the product page,so i'm going to click on the product,right here on our shopify store and the,first thing we're going to do is just,delete the product name that is imported,from aliexpress and also the product,description so now that i know my brand,name i'm actually going to use it for,the product title as well so i'm going,to type in my easy breeze and i also,like to add this trademark symbol right,here to the end of the brand name,because it looks a lot more official and,then i follow up with the product name,so let's say mini cooling fan and then,we're gonna move on to the description,so now just for you to see where the,description of the product will actually,be seen on our store it's gonna be on,the product page when people scroll down,on the product page so here we can see,this is the product page that we're,going to build right now and then after,the add to cart button here is where the,description starts so we can add images,we can add some text we can add some gif,images and,here is basically where people scroll,when they are not sure if they should,buy if they should buy the product or if,they just need some more information so,this is a great place for you to,communicate the main benefits that,people are getting with this product and,also address some of the objections that,people have,when they think about buying this,specific product so for example when,people think about oh maybe the battery,is not going to last very long then tell,them how long the battery is going to,last and hopefully it's going to it's,going to kill their objection and,they're going to think okay this is,actually a good product and then they're,gonna end up buying so this is exactly,what we wanna do with our product,description and in order for us to,create that product description we're,gonna have to do some research about our,specific product so the way i like to go,about doing the product research and,creating the sales copy for my product,is to simply open up a google docs and,then here i'm gonna just take some notes,on everything that i find about the main,benefits of this product and also some,of the objections that people have in,regard to this specific product and the,place where i like to start with the,product research is actually the place,where i'm gonna buy this product from,somewhere i'm gonna drop ship it from,which in this case is aliexpress so here,we can simply scroll down and read the,description of this product but usually,you don't find too much information here,you can find some things about the,quality like the materials they have,used for this specific product some of,the functionality of the product and so,on but usually i find more information,when i actually go to the customer,reviews right here and just start,reading some of the reviews because in,the reviews of actual customers we can,find a lot of information about why,people have bought this product and what,they like about it so here for example,we can see fast charging,makes the heat so much more bearable,battery lasts several hours so just from,this review we can see that charging,fast is kind of an important topic for,this person here and also battery lasts,several hours so battery life is,probably a topic that we want to address,in our sales copy then we have great,handy cooling fan and looks amazing as,well so here we can also make some,references about the great design of,this fan because this might also be a,good selling point why people want to,buy this because it just looks great and,then another great way to do some,product research is to simply look at,other stores that are selling the exact,same product and i'm going to quickly,show you how to easily find these other,stores so what i do is i simply take one,of the images of this product that i'm,selling so the easiest way is to go to,the description right here scroll down,and then just drag this image to your,desktop and then you're going to open up,a new tab and type in google images,and click on google images right here,and then what we're going to do is we're,going to search for all the websites,that have this specific image so i'm,going to click on search by image right,here and now i can simply drag this,image,in this field right here and then google,is going to give me all the sites that,have this image on their page and,naturally these are going to be all the,sites that are selling this specific,product so here we can see another drop,shipping store selling the exact same,product and they also are using the,sense theme as we can see here so the,site already looks kind of similar than,what we are building right now so here,you can just go through the sales copy,that they're using right here and then,look at what points you also want to,include in your sales copy another great,page to go on is to go on amazon people,are also selling this product on amazon,then you can simply scroll down look at,the product description right here here,you can also find some important,information some good selling points and,again go to the reviews as well so you,want to click on the reviews the ratings,right here so now after a couple of,minutes of going through some of the,reviews and some of the product,descriptions i noted down these main,benefits and also these,objections that we have to address in,our product description the next step,would be to create very good headlines,from these points right here now for all,the points that i want to address in my,sales copy i quickly created some,headlines like for example enjoy a fresh,and cool breeze whenever and wherever,you want or my easy breeze is always,with you ready to blow this is,addressing the portable and compact,design benefit so then once you have all,of your headlines you want to also,create a quick description for each of,the headlines,so in the quick description you just,want to create like two or three,sentences explaining exactly what the,benefit is like for example feeling hot,just take out your my easy breeze and,let it let it do its job it will refresh,you literally everywhere at work while,traveling or just watching netflix on,your phone the slim and foldable design,makes my easy breeze fit in every bag or,pocket enjoy the cool breeze hands-free,with its comfortable strap so we just,want to create a compelling description,for each of the headlines right here and,now the last step is to find some good,visuals that underline these benefits,right here so you can just use images if,you want to but a even better way would,be to use gifs because with a gif you,can communicate a lot better how a,product works and it's a lot more,engaging and keeps people on the page a,lot more than just images if you have a,video available for your product which,in the case of this product we have,because this first one here this is a,video then what you want to do is you,want to create some gifs out of this,video so the way i like to do it is to,just go to inspect right click and,inspect and then we should be able to,find this video right here by going to,uh the down arrow right here then we can,see,this is the link of the video but we're,just gonna open this in a new tab,and then we can see,we should be able to see,the video right here so now we can click,on the three dots and click on download,and the next step will be to simply um,convert some of these scenes here in,this video in a gif format which i'm,going to show you how to do now so once,it's downloaded we can simply go to,google and type in gif,creator i think,and that should take us to this easy gif,dot com which is a very easy gif creator,then we're gonna just drag the video in,right here and then click on upload and,make gif,and then here we have the entire video,for this specific product so what we,want to do is find moments where,what we have put here in the description,it will be showcased very well so for,example um,my easy my easy breeze is always with,you ready to blow i want to find a part,where she basically takes it out of the,bag like right here,and,then i can just click on use current,position this will be the first point of,the gif and then she takes it out,and she turns it on so this will be the,entire,gif,so i'm just going to find the end point,right here click on,end time use current position and then,i'm going to click on convert to gif,and now it will convert that part of the,video,to a gif that i can now download by just,clicking on save right here on the top,and now i have it saved right here so,i'm going to do that for every single,headline right here that i have for this,product so what i've done is just,created a folder for all these gif,images that i've created for the product,description as you can see right here,and again if you can't find any video to,create gifs from simply use some of the,images that you can find for your,product that makes sense for your sales,copy so now we have everything that we,need for our product description so we,can just copy everything that we have,prepared right here in the google docs,copy and then we can just paste it into,our description and now we also want to,add our gifs or images that we have just,prepared so i'm gonna add the first one,just here under the first title so i'm,gonna click on this insert image icon,and then i'm gonna go to my folder where,i have the content for this store and,i'm gonna click on gifs and i think the,first one is this one right here so i'm,just gonna drag it in once it's uploaded,we can simply click on the gif and then,click on insert image great so then i'm,basically doing the same thing for all,the other gifs so the next one will just,be right here under the second title and,then here on the bottom i also added a,guarantee so this is just a 30-day,money-back guarantee for everybody who,isn't satisfied with the product this,will just remove some risk for the,customer which should increase our,overall conversion rate and i'm also,going to add an image right here so it's,a bit um easier to see in the,description and it's going to be this,one right here i used to,create this it's very an easy design,tool where you can just drag in some,text and then add a background so very,easy to do and then all the way on the,top of the description i actually like,to add a bundle offer that's also a very,good way to increase your average order,value on your store to entice people to,actually not buy only one product but to,buy two or even more products by giving,them a discount so there are different,apps that you can use to offer people,discounts the easiest way to just start,out and test the product is to just,create something like this um again just,an image where it says buy two or more,get an extra twenty percent off or ten,percent off or whatever you want to,offer and that will be automatically,applied at checkout which we're going to,set up in a moment here and now that we,have all the content in here what i like,to do is just click on all the images,and make sure they are centered and also,the gifs are centered and then also the,titles i want to change them from,paragraph to heading 3. that just makes,them a bit bigger and then i also want,to make it centered as well and i'm,going to do that for all the titles and,all the images as well awesome so this,is everything that we're going to do for,our product description to just test,this product and we're going to look at,how this looks like on our site just in,a moment and for now let's just click on,save to make sure we have all the,changes saved and then let's move on to,the product images so because we have,used the deezers app to import our,product to shopify the pictures that are,already here on the product,page,they are the ones that we find here on,aliexpress if you scroll down here it's,just importing all these images which to,be honest aren't that bad so i'm gonna,use these images that i find right here,in aliexpress now sometimes it's very,hard to find good images for your,product what you can also do is just go,to google image search again,and then you want to do the same thing,as we've done before with the product,research you're just going to do a,search by image and then you're going to,drag in one of the images you get from,your supplier and that way you're going,to find more images so here when you,click on visually similar images google,is going to give you a lot more images,of visually similar pictures and a lot,of the time you're going to find more,images about your specific product that,you want to sell,and here you want to be careful to not,use any copyrighted images from other,competitors that have already taken,custom-made images but if those images,are from the supplier then usually it's,fine to use them on your store,especially if you just want to test the,product so for now i'm just going to use,these pictures that i have from,aliexpress right here and i'm just going,to rearrange the order a bit by just,dragging these pictures around so i,actually did go and find some more,pictures for this product because a lot,of the pictures from aliexpress they had,a lot of text on it and i didn't really,like how that looks on the store so i,actually go went and used the method i,showed you before to find the same,pictures but without any text and i did,find some so these are the ones that i,found and then that i want to use on the,store so it's just going to be some some,pictures of people using the product,some of the different use cases,and then at the end there's going to be,the four different variants,so then let's move on to the next step,which is the options for this product it,already has imported a couple of options,so the color and the ships from we can,actually delete this one because you,don't really need that on our store then,for the colors we can leave it as it is,because we are selling all the variants,the white the green the blue to pink so,we're going to click on done right here,and then we're going to make sure that,we have pictures for all of the variants,so for the white one we're going to,click on this image right here and then,just going to choose either this picture,or this one i think i'm going to choose,this picture right here and then we're,going to do the same thing for the other,variants as well,and then to adjust the price of the,product we're going to click on edit for,one of these variants right here,and then here for every variant we can,set a price so i want to sell this for,29.99,just to start out and test the product,and i'm also gonna add a compare price,so people can see it's actually on sale,i'm gonna put here 59.99,so it says that it will be 50,off,and i'm basically doing the same thing,for all the other,products as well so the green one the,blue one and the pink one they're all,gonna have the same price,so once that's done we can go back right,here,and then the last step is to adjust the,url for our product now as you can see,this is our current url right here which,looks kind of too long and not really,nice so we're gonna click on the edit,website seo button and the page title is,actually fine my easy breeze mini,cooling fan looks very branded you can,add a description right here i'm not,going to bother with that right now what,i'm going to do is just change the end,of the url to something that is a bit,shorter and just my easy breeze,so that's it then i'm gonna click on,save,and now as you probably remember we have,added a bundle discount offered to our,product description right here,so when people buy two or more products,they're gonna get a 20,discount and now we want to actually set,this up in our shopify dashboard so that,the discount will be automatically,applied in on the store so i'm going to,again click on save right here and then,we're going to go to the left side and,click on discounts right here where we,can set up all the different discounts,that we want to offer we're going to,click on create discount here here we,can choose from different discount types,we're going to use the amount of order,discount so i'm going to click here,and then we're going to do the automatic,discount we're going to name this,bundle discount,and we're going to do a 20,off again you don't need to do 20 you,can also do less than that or more than,that whatever makes sense for your,profit calculation and the the reason,why we do this is just that when,somebody orders more than one product,then we can save some money in,advertising costs and also in shipping,cost and usually that,just gives us more profit overall so,it's definitely a good idea to offer,bundles for most products,and then minimum purchase requirements,so we're going to say minimum quantity,of items is going to be two so when they,buy two or more,they're going to get the 20 discount on,the entire order start date will be,today and then start time doesn't matter,and you can also set an end date but for,this one it doesn't really matter so,we're just going to leave this as it is,and click on save discount,so now we're almost finished with the,product page let's go into the editor,and look what our product page currently,looks like,so let's click on online store on the,left side and then go to themes,and then here we can click on customize,just next to our theme,and that will open up the editor for our,online store so here we are just on the,home page which is just by default made,from our template we're going to make,some more adjustments right here as well,but for now let's change from our home,page to the product page and here we can,just click on default product,and that will open up the product page,that we have just created,now what i like to do is actually switch,from the desktop view to the mobile view,right here on the top right,that way we can see exactly how it looks,like on mobile which again is how most,people will see your page because,they're going to be visiting from a,mobile phone so this is how our page,currently looks like we have the image,the title of the product the price that,we have decided on the different,variants and then the add to cart button,the buy button and then here is the,description that we have prepared with,our images and also our gifs um so that,looks all quite clean that's amazing and,then we have some more things here on,the bottom now just so you understand,how this editor works you basically have,all the elements all the blocks on this,page here on the left side you can click,on them here and then you can make all,the adjustments here on the right side,of the editor so let's go from top to,bottom and make some adjustments to our,product page so let's start with the,announcement bar all the way here on the,top you don't actually need this so if,you don't want it you can just click on,the delete icon right here and then it,will just be gone from your page,if you want to undo something just click,on the undo button right here on the top,and then it will go back to what it was,before,then here to change it we just go to the,right side and i'm gonna actually change,the text to this right here,only today 50 off and free shipping and,that's everything that i'm going to do,here for the announcement bar then the,images are fine here what i'm going to,do is remove this store name here from,the product page so i'm going to just,click on it and then hit the lead icon,and then it will be gone the title is,looking good price is looking good color,quantity here for the buttons you can,actually just change it to only show one,button so when you click on uh we need,to untick this option on the right side,you only have the add to cart button,which makes everything seem a bit,cleaner so i like to do that here on the,product page and then here we're going,to scroll down to the description so we,have already optimized everything here,so that looks good and then here these,elements where you can basically click,on the arrow and then it will just show,some text we can use them for our faqs,for our product information how to use,shipping return policy and so on so to,change these we can just click on them,and then on the right side we can change,them to for example faq,and then we also want to change the icon,from a plan to something that makes,sense let's say we're going to use the,question mark for faqs and then for the,content here we can just type in,all the questions that that people have,about,our product and then also give the,answers right under the question then,we're going to do the same thing here,for the other elements here so this for,example would be how to use and then we,could just uh give us a brief,description here,on how to use this product if you want,to add more of these elements you could,just go to the left side click on add,block right here,and then you can add something like a,collapsible row this is what this,element is and then it will just add,another one of these elements and to,rearrange these elements we just go to,the left side hold the element right,here and then drag it wherever you want,it to have for example right here and,then it will just change the order so,these are elements that i would add for,this page simply some faqs product,information some technical,specifications,how to use section shipping policy and,also return policy then you could also,use these elements here to talk about,your brand add some more visuals and,stuff i usually just delete all of them,because i think it's too much for the,product page and after these drop down,menus i actually want to have the,reviews which we're going to add later,on so here for all these sections i'm,simply going to click on remove section,on the bottom right here again remove,section so we can just easily delete,everything that we don't need on the,page

Congratulation! You bave finally finished reading how to add a product page on shopify and believe you bave enougb understending how to add a product page on shopify

Come on and read the rest of the article!

Browse More Content