How-to's · Shopify · 3 min read
Best Shopify Slideshow Dimensions: A Practical Size Guide
Short answer
Upload Shopify slideshow images at about 1920 to 2400 pixels wide, keep every slide the same aspect ratio, place key content in the center, and add mobile-specific images if your theme supports them. The exact height depends on your theme's slideshow height setting.
Slideshow sections are among the most common Shopify homepage features, and among the most common sources of cropped faces and cut-off text. Getting dimensions right is simple once you understand how themes display slides.
How Shopify themes display slideshows
Most themes, including Shopify's free themes like Dawn and the Horizon family, let you choose a slideshow height: options like small, medium, large or adapt to image, depending on the theme. The theme then fills the slide area with your image, cropping where needed so it covers the space.
On a wide desktop screen, the top and bottom of your image may be cropped. On a narrow phone, the left and right sides get cropped heavily. That is why one image rarely looks perfect everywhere.
Recommended sizes
| Element | Suggested size | Notes |
|---|---|---|
| Desktop slide | 1920 to 2400 px wide | Wide aspect such as 16:9 or 3:1 |
| Mobile slide (if supported) | 750 to 1080 px wide | Taller aspect such as 4:5 or 1:1 |
| File format | JPG or WebP | PNG only if transparency is needed |
These are common practical guidelines rather than official Shopify requirements. Check your theme's documentation for any recommended sizes.
Rules that prevent problems
Use identical dimensions for all slides
Mixing aspect ratios can cause the section to jump in height or crop each slide differently.
Keep the important stuff centered
Faces, products and focal points should sit in the middle area of the image so cropping on either axis does not cut them off.
Do not bake text into images
Use the theme's heading, text and button fields. They resize properly on mobile and are readable by search engines and screen readers. Text inside images often becomes tiny or gets cropped.
Use "adapt to image" carefully
This setting shows the full image without cropping, but tall images can push your products far down the page on mobile.
Add mobile images if your theme allows
A separate, taller mobile crop usually looks far better than letting the theme crop a wide desktop image.
Should you use a slideshow at all?
Many ecommerce experts are skeptical of homepage carousels:
- Most visitors only see the first slide.
- Auto-rotation can move content before people finish reading.
- Multiple messages dilute focus.
- Extra images add page weight.
A single strong hero banner with one clear message and button is often more effective. If you use a slideshow:
- Limit it to two or three slides.
- Put the most important message first.
- Consider turning off auto-rotate or setting a slow interval.
- Make sure controls are easy to use on mobile.
Track clicks on each slide using analytics events or UTM-tagged links to see whether later slides get any engagement.
Optimizing image weight
- Compress images before uploading.
- Shopify serves responsive, optimized versions automatically on modern themes, but very large originals still slow editing and uploads.
- Add descriptive alt text to each slide.
Alternatives to a slideshow
- A single hero banner with one clear call to action
- A featured collection directly below the header
- An image-with-text section telling your brand story
- A short looping video without sound
Many stores find these perform as well or better than rotating slides.
Testing checklist
- Upload all slides at the same dimensions.
- Preview desktop, tablet and mobile in the theme editor.
- Check that no key content is cropped.
- Confirm text overlay contrast is readable.
- Test load speed with PageSpeed Insights.
For banner sections beyond slideshows, see Shopify banner sizes. If you are choosing a theme, check the best free Shopify themes. For layout ideas that improve sales, read how to optimize your ecommerce website for conversion.
Frequently asked questions
Why do my Shopify slideshow images look different sizes?
If slides have different aspect ratios, some themes resize the section between slides or crop each differently. Use identical dimensions for every slide.
Do slideshows hurt conversion?
They can. Many visitors never see slides after the first, and auto-rotating content can be distracting. A single strong banner often performs as well or better.
What aspect ratio should slideshow images use?
A wide ratio such as 16:9 or 3:1 suits desktop. Taller ratios such as 4:5 suit mobile. Check how your theme displays slides at your chosen height setting.
Platform features, prices and policies change. Check the official help pages linked above before you act on a detail that matters to your store.