Image Dimension Guidelines Across Homepage Sections

 

Given that you're already aware of our specially crafted custom layouts for the Category, Product Showcase, Testimonial, text, Image & text, Hero Banners sections, etc... 

Here we've outlined the specific Image dimensions for a few layouts, ensuring your visuals look perfect on both desktop and mobile devices.

Choosing the Right Image Dimensions for Hero Banner 

Login to your dashboard > My Online Store> Builder > Add a new section> Hero Banner > Select layout

Screenshot 2023-12-19 at 4.24.18 PM.png

 

Hero Banner Layout Desktop Image Dimensions

 

Layout Number Device  Image dimension size
Hero Banner 1  Desktop 608 X 436
Hero Banner 2 Desktop 1440 X 554
Hero Banner 3 Desktop 1440 X 598
Hero Banner 4 Desktop 1440 X 509
Hero Banner 5 Desktop 1440 X 650
Hero Banner 6 Desktop 1440 X 652
Hero Banner 7 Desktop 1440 X 563
Hero Banner 8 Desktop 1008 X 550
Hero Banner 9 Desktop 1440 X 650

 

Hero Banner Layout Mobile Image Dimensions

Layout Number Device  Image dimension size
Hero Banner 1  Mobile 414 X 375
Hero Banner 2 Mobile 414 X 283
Hero Banner 3  Mobile 414 X 350
Hero Banner 4  Mobile 414 X 351
Hero Banner 5  Mobile 414 X 375
Hero Banner 6  Mobile 414 X 428
Hero Banner 7  Mobile 414 X 321
Hero Banner 8  Mobile 414 X 250
Hero Banner 9  Mobile 414 X 210

 

Recommended Image dimensions for testimonial customer images

Layout Number Device  Image dimension size
Testimonial  Desktop 200*200

 

Choosing the Right Image Dimensions for Category Showcase Sections

Login to your dashboard > My Online Store> Builder > Add a new section> Category showcase > Select layout

 

 

Category Showcase(CS) Layout Image Dimensions 

Layout Number Device Image dimension size
CS-1 Desktop 588 X 300
CS-2 Desktop 588 X 250
CS-3    
< 2 categories Desktop Image 1  - 698 X 300
  Desktop Image 2 - 488 X 300
3 categories  Desktop Image 1-  698 X 564
  Desktop Image 2,3  -  488 X 270
4 categories Desktop Image 1,3 - 698 X 270
  Desktop Image 2,4 - 488 X 270
5 categories Desktop Image 1,3    - 698 X 360
  Desktop Image 2,4,5 - 488 X 230 
CS-4    
< 2 categories Desktop Image 1  - 756 X 300
  Desktop Image 2 - 444 X 300
3 categories  Desktop Image 1  -  756 X 554
  Desktop Image 2,3  -  444 X 270
4 categories Desktop Image 1,3 - 756 X 270
  Desktop Image 2,4 - 444 X 270
5 categories Desktop Image 1,3    - 756 X 362
  Desktop Image 2,4,5 - 444 X 236 
CS-5 Desktop 280 X 250
CS-6 Desktop 278 X 245
CS-7 Desktop 280 X 220
CS-8 Desktop 260 X 260
CS-9 Desktop 280 X 200
CS-10 Desktop 384 X 216
CS-11 Desktop 352 X 252
CS-12 Desktop 352 X 252
CS-13 Desktop 280 X 280
CS-14 Desktop 332 X 282
CS-15 Desktop 512 X 352
CS-16 Desktop 246 X 285
CS-17 Desktop 180 X 180
CS-18 Desktop 522 X 416
CS-19 Desktop Image1, 2 - 514 X 380
CS-19 Desktop Image 3 - 514 X 778

 

Product Showcase (PS) Layout Image Dimensions 

Layout Number Device Image Dimension Size
PS -1 to PS 10 Desktop 1024x1024 
PS - 11 to PS14 Desktop

800x1200

Start Exploring
Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request