Content Image Sizes

Content Image Sizes
June 21, 2014 Atelier
In Theme Documentation

Below are a list of the image sizes that the theme uses based on the different assets/locations within the theme:


  • 5 Column (Standard) – 400px x 300px, (Retina) – 800px x 600px
  • 4 Column (Standard) – 400px x 300px, (Retina) – 800px x 600px
  • 3 Column (Standard) – 600px x 450px, (Retina) – 1200px x 900px
  • 2 Column (Standard) – 800px x 600px, (Retina) – 1600px x 1200px
  • 1 Column (Standard) – 1200px x 900px, (Retina) – 2400px x 1800px


  • 4/3 – Wide Tall – 1000px x 750px, (Retina) – 2000px x 1500px
  • 4/3 – Tall – 375px x 750px, (Retina) – 750px x 1500px
  • 4/3 – Wide – 1000px x 375px, (Retina) – 2000px x 750px
  • 4/3 – Standard – 500px x 375px, (Retina) – 1000px x 750px
  • 1/1 – Wide Tall – 900px x 900px, (Retina) – 1800px x 1800px
  • 1/1 Tall – 450px x 900px, (Retina) – 900px x 1800px
  • 1/1 Wide – 900px x 450px, (Retina) – 1800px x 900px
  • 1/1 Standard – 450px x 450px, (Retina) – 900px x 900px

If you are using the Gutters option, then please add 50px height (100px for retina) for Tall size, and 15px (30px retina) for Wide Tall.

Portfolio Detail

  • Full Width (Standard) – 2000px x ANY, (Retina) – 4000px x ANY
  • Standard Width (Standard) – 850px x ANY, (Retina) – 1700px x ANY


  • Mini (Standard) – 446px x 335px, (Retina) – 892px x 670px
  • Mini with sidebar (Standard) – 370px x 260px, (Retina) – 740px x 520px
  • Masonry (Standard) – 480px x 360px, (Retina) – 960px x 720px
  • Timeline (Standard) – 970px x 728px, (Retina) – 1940px x 1456px

Blog Post

  • Detail (Standard) – 1170px x ANY, (Retina) – 2340px x ANY
  • Detail with sidebar (Standard) – 770px x ANY, (Retina) – 1540px x ANY

Widget Images

  • Recent Portfolio / Recent Posts (Standard) – 94px x 70px, (Retina) – 188px x 140px


Shop Index

You can set any size for the shop height, but please note that as Atelier uses a CSS grid, the width of the product image will be determined by the browser width and how many columns you have to display.

Product Page

The product page image defaults to 50% width as standard, although you can resize this with custom css. The image height/width can be whatever you like, but we’d recommend the width to be at least 50% of your site’s max-width.



You can see the image sizes that we use on the demo to the right. If you aren’t sure what to set, then we recommend you use our settings.

WooCommerce Image Sizes

Comments (0)

Leave a reply

Your email address will not be published. Required fields are marked *