BACK

how to make a shopify header image

Shopify Homepage Banner Size. How to Edit and Size Your Shopify Banner. what's going on everyone it'

Ecom Masterclass

Updated on Feb 25,2023

Shopify Homepage Banner Size. How to Edit and Size Your Shopify Banner.

The above is a brief introduction to how to make a shopify header image

Let's move on to the first section of how to make a shopify header image

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

WHY YOU SHOULD CHOOSE TTHUNT

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.

Shopify Homepage Banner Size. How to Edit and Size Your Shopify Banner.

what's going on everyone it's jamie here,from shopify masterclass and today would,be covering homepage banner sizing,what's the exact size you need for your,shopify store we'll also go over an,example on how to edit it and make sure,you can fit your homepage image into the,desired image size so you can get a,really nice looking banner on your,homepage as if a customer loads the home,page this is going to be the first thing,they see typically so you want to make,sure it's looking really good and so,we're going to go over how you can do,that exactly using a few free tools,today so make sure you stay to the end,of the video here before i dive into it,i just want to thank our sponsor,profitcalc the one-click profit,calculator app available on the shopify,app store it's going to allow you to,skip those spreadsheets and get back to,growing your business and it's going to,come with a 15 day free trial there's a,link in the description below to check,that out i'm just going to show a quick,video detailing their full feature set,discover profit calc the affordable and,easy to set up shopify app that crunches,your numbers in just one click it,automatically syncs with all your,accounts and expenses to calculate your,profit displaying everything in an easy,to read dashboard so you understand your,business in real time start for free on,the shopify app store today so now let's,start with our home page banner creation,i'll pull up a handy guide here from,tiny image showing the exact dimensions,you need for each of your banner sizes,so here we're going to focus on image,with text over like banner images and,that's going to be 1800 by 1000. so,let's use that here when creating our,banner image let's go through an example,step by step from finding an image to,actually adding that to our banner here,and sometimes it can take a little,customization depending on how you want,it to look on both mobile and desktop,let's first head to unsplash here the,internet source of freely usable images,and so this test shopify store i'm going,to use is summer theme that's going to,sell surfing stuff so i'm going to,search surfing here so i get some nice,images now i'm looking for something a,little more horizontal to fit across,that banner i'm first going to download,that and then we can use that and,customize it to the exact size and,dimensions we need so just downloaded,this image here now i'm going to head to,canva which is a really great way to,customize image sizing and it is free to,use which is very awesome there so once,you head here you want to hit create a,design in the top right and hit a custom,size here and so we go back to the cheat,sheet here again looking for an 1800 by,1 000. let's enter that in 1800 by 1000,and hit create a design this is going to,be measured in pixel next we want to,upload our image go into the upload,section in canva once that's uploaded i,just want to click on it and i'm going,to get it to fit within this banner size,so it's going to look nice in my shopify,store so i'm just going to drag it here,and try to get a good position making,sure it fits the width then i'm going to,stretch it a little bit there and just,like that looks to fill up most of the,image once i'm done i just go to share,in the top right hit download if you do,have canva premium you can compress it,to a low file quality i'm just going to,leave it like this right now and,download that let me to note if you,don't have canva premium you kind of,want to compress your homepage image so,it's not going to take as much space,when loading it as images can be quite,memory heavy so you want to go to a site,like tiny png upload your banner image,here and then download that it's going,to compress it by quite a bit so you can,see the original image size is 2.7,with tiny png here you can compress it,down to 680 kilobytes which is,significantly smaller by around 75,percent all right so now we have our,banner image let's head into the online,store section so we can get to our theme,customization options hit the customize,button here on the theme page it's going,to bring us to our homepage you already,have a sample image in the background,but you want to head to the slideshow,section or the banner section of your,website you want to click on that head,over to the image want to hit upload,here for the images as well i'm going to,upload the image i just created i'm just,going to wait for that to upload here,now that's uploaded i'm just going to,select it and as you can see it fits,extremely nicely as a banner image we,have the full width here along with,almost all the details that were in the,regular image so i think that looks,really great if we check the mobile here,we can see it compresses nicely as well,i've also just changed the text,description there so it looks a little,nicer with our surf shop so overall,that's how you add a home page banner,that's how you edit the size so it fits,correctly overall it's quite an easy,process it's a little know-how in terms,of how to get the right sizing you can,experiment with different sizes as well,depending on your image and how you want,that to show up so it can take a little,testing there but overall this concludes,the video if you enjoyed the video i,would love it if you hit that like,button and that subscribe button below,if you have any questions leave a,comment if you haven't yet check out,profit calc the one click profit,calculator app available on the shopify,app store it's gonna come with a 15-day,free trial there's a link in the,description below thank you so much for,watching and i'll see you in our next,video

Congratulation! You bave finally finished reading how to make a shopify header image and believe you bave enougb understending how to make a shopify header image

Come on and read the rest of the article!

Browse More Content