How To Resize Images For Shopify

February 21, 2019

How To Resize Images For Shopify

We get lots of queries from clients about how to resize images to the right size for Shopify product images or banners etc and what sizes to use.

We use Photoshop for all imaging editing, but not everyone has access to this tool so here are some free online image tools you can use:

1) Use Canva to resize your images - you can save as the corect size or crop as necessary, here is a tutorial:
https://support.canva.com/create-your-design/photos/resize-crop-photo/

2) PicMonkey is also another free online tool you can use to resize images. Here is a link to a YouTube tutorial on how to resize images in PicMonkey:
https://www.youtube.com/watch?v=0HsefQ6OnWs

3) https://tinyjpg.com/ - this tool will save your images in the smallest file size possible while trying to keep the best quality. Try it out - I have found image quality is sometimes comprimised with it so you'll need to try it with your images to see. This is a file size optimisation tool, not an image resizing tool, so you'll need to have resized your images first.

When it comes to sizing your product and banner images, they need to be good quality but not too large in file size that they slow your website down particularly on mobile. For a more professional looking site you ideally want all your product images to be the same size - or even just to have all the images in a collection the same size. Save all banner images and product images as JPEG as you'll get a better file size. If your image editing tool has an option to web optimise an image be sure to use it.

4) Other online options
Photo editor online - Pixlr.com
https://pixlr.com/

Photopea | Online Image Editor
https://www.photopea.com/

1) Banner Images Sizes
It does depend on the theme you are using and some themes will have recommended image sizes for you in the theme customisation area. However, these are my go-to sizes for banners:
- tall/full screen banner: 1800px(w) x 1000px(h)
- medium banner: 1800px(w) x 550px(h)
- skinny banner: 1800px(w) x 350px(h)

2) Product Image Sizes
There are 3 main image orientation options - square, landscape or portrait:
- portrait: I find works well for clothing websites, as it allows you to show the whole outfit without too much wasted white space. Ideal sizes could be 800px(w) x 1000px(h)
or 600px(w) x 800px(h)
- landscape: I don't do many sites with landscape product images, but if your products suit landscape image orientation then I'd recommend using 800px(w) x 600px(h) or 800px(w) x 400px(h)
- square: if in doubt choose square! Square is the most popular choice for product images as it suits most products. You shouldn't need to go larger than 800px x 800px for most themes.

If you need help with image editing on your Shopify site or any other small tasks, then one of our support packages could be the ideal solution. Get in touch to find out more.

Leave a comment

Comments will be approved before showing up.

Join our mailing list.