6. Mr Parker Theme: Understanding Image Sizes & Ratios

Mr Parker will adapt to a diverse range of image sizes, each store may vary but as a guide, the following image sizes will render good results for most users. In this article, we will go through the different images throughout the theme with suggested sizes/ratios.

SLIDESHOW

Our themes let you create a slideshow of images on your homepage. You can set the rotation frequency, and provide text over the slideshow image that links to a page in your store. Slideshow images should always be landscape orientation (wider than they are tall). The height of the slideshow on your site is completely dictated by the height of the tallest image you use. 

To avoid the extra white space below an image you must make all your slideshow images the same ratio (or size).

If you set your Slideshow to enable full-width, then use images that are 1920px wide. If the Slideshow is not set to full-width than use images that are 1200px wide. We suggest the following resolutions…

Full-width - 1920px x 900px   
Not Full-width - 1200px x 800px 

IMAGE GALLERY

There are no fixed heights for images, the width is the important factor in order to ensure high quality. You can use any height images that you would like. When using more than 1 image within a row of images, however, it is imperative to make the images the same height to ensure a grid layout is maintained. Here are some suggested sizes…

  • 1 image - 1600 x 900px (W x H)
  • 2 images - 900px x 600px (W x H)
  • 3 images or more - 600px x 400px (W x H)

Advanced layout Image Gallery

As used within our main theme demo you will need to use the image alignment tools within the advanced layout section also as follows:

Image 1 = Align left, at 66% width, use an image 781px x 1000px

Image 2 = Align right, at 33% width, use an image 1000px x 620px

Image 3 = Align right, at 33% width, use an image 1000px x 620px

Blog post featured images

Landscape images will always look better, 900px wide x any height you like with work for the blog post featured image.

PRODUCT IMAGES

To ensure a high quality of product images across the site and to ensure that the zoom function on your product pages can display at a satisfactory level we suggest using the following sizes for product images…

  • 650px x 1000px (for horizontal images)
  • 1000px x 650px (for vertical images)
  • 1000px x 1000px (for square images)

CROPPING IMAGES

If you need help cropping your images check out our tutorial  here.