Image guide
The size of your uploaded images can help ensure that they're high quality, load fast, and look good on all devices. Below you will find recommendations for image dimensions, file size, and image orientation.
Ira also includes a number of image settings to help adjust your images in the theme editor to get them looking their best for desktop and mobile.
Image dimensions (how many pixels tall or wide?)
We recommend uploading images with a minimum width of 2048px.
In general, Ira does not have required image dimensions for product or feature images, unless specified in the theme editor. However, Shopify automatically resizes all images to fit your customers' devices, so uploading images with a minimum width of 2048px will ensure optimal quality and avoid any pixelation.
File size (how large should the file be?)
Feel free to upload image files as large as Shopify can handle.
Shopify can host image files up to 20MB and will automatically resize images to balance speed and quality. While larger image files don't necessarily mean higher quality images, you can be sure they won't impact your site speed.
We recommend keeping video files (.mp4) to less than 10MB for best performance across all devices and internet connection speeds. Autoplay videos that are short — around 5 to 10 seconds — work best overall, which will limit your .mp4 file size.
Image orientation (what's the best shape to use?)
There's no single image orientation or shape required for product or feature images.
In general, Ira handles all image orientations and will adapt accordingly, whether your images are Square (1:1) (equal width and height), Landscape (3:2) (width greater than height), or Portrait (2:3) (height greater than width).
Learn about Ira's Image aspect ratio setting below, which lets you crop your uploaded images to a single uniform shape.
That said, here's a few recommendations for your uploaded images:
For product images, often the best orientation to use is square (1:1) or portrait (2:3). But above all else, consistency is key: select one orientation or shape for your product photography to keep product grids looking uniform and professional.
For feature images, often the best images are landscape (3:2) or square (1:1). We recommend avoiding portrait images for sections that span across the page, such as the Slideshow and the Images with text sections. Portrait images in these areas may look stretched, oversized, and force customers scroll down to see the whole image.
With exception, you will find recommended orientations for the following features:
| Feature | Image recommendation |
|---|---|
Slideshow | Landscape (3:2) or Square (1:1) |
Featured products | Portrait (2:3) or Square (1:1) |
Image with text | Portrait (2:3) or Square (1:1) |
Contact page image | Portrait (2:3) |
Popup background | Landscape (3:2) |
Video featured image | Landscape (3:2) |
Image settings available in Ira
In Ira, most feature sections include some image settings to adjust their size or shape and help your images look great.
The Image aspect ratio setting lets you crop your uploaded images to make them all Square (1:1), Landscape (3:2), or Portrait (2:3). You can select the Natural option to show all images with their original orientation.
The aspect ratio describes the relation between the width (w) and height (h) of an image, stated as
w:h. For example, an image that is 400px by 200px has an aspect ratio of 2:1 because its width is twice as large as its height. All square images of any size, have an aspect ratio of 1:1 because the width and height are equal. To learn more, see Shopify's image editing guide.
Below is an example of how the Image aspect ratio setting can make your product photos with different original orientations look uniform and consistent.
See our articles about the Slideshow, Carousel, Image with text, and Text columns with images sections to learn about additional image settings for Mobile-specific images, Image height, and Image width.
Below you'll find a list of image settings available for all Ira features and sections:
| Feature | Image Settings |
|---|---|
Logo | Custom logo size (70px - 370px) Recommended: set custom width to actual logo image width. |
Blog pages | Image aspect ratio |
Collection image | Image position (focal point) |
Collection product grid | Image aspect ratio |
Collection list | Image aspect ratio |
Recommended Products | Image aspect ratio |
| Section | Image Settings |
|---|---|
Blog posts | Image aspect ratio |
Collection list | Image aspect ratio |
Featured collection | Image aspect ratio |
Carousel | Mobile Height |
Gallery | Image aspect ratio |
Image with text | Media width (1/2 or 2/3) Media position |
Slideshow | Mobile image Height (Desktop and Mobile) |
Featured products | Image position (Left or Right) |
Text columns with images | Max image width (slider) |
Templates
Theme Settings