Shopify Themes: Slideshow image size best practices || Shopify Help Center 2018

Shopify Themes: Slideshow image size best practices || Shopify Help Center 2018

August 10, 2019 9 By Peter Engel


This video covers best practices with image
size when using a slideshow in your theme. Full-width images, such as slideshows and
images with text overlays are common sections in Shopify themes. In this example, you see the slideshow of
the free theme called Brooklyn. The slideshow is a chance to grab the customer’s
attention! It should help build your brand identity,
so the image should always relate to your business. Start by clicking on the slideshow section
on the left-hand side of your theme customizer, and see what editing options are available. It is important to note, that slideshow customization
options in the Brooklyn theme, might not be the same as the slideshow customization options
in any other theme you choose. The size of the slideshow area is quite large,
particularly in the theme Brooklyn, and requires a high resolution image. If the image is blurry, low quality or unrelated
to the business, the potential customer may leave the online store entirely. Do not to fill the slideshow with any images
“just because”; make sure the image relates to your business. If you’re selling beachwear, then an image
of someone at the beach or examples of the bathing suits is a great idea for the slideshow. You are also not required to have multiple
images in your slideshow. This example shows one image uploaded, which
will be the only image that displays on the online store slideshow. Aspect ratio plays a big role in how images
are cropped. Aspect ratio is the height and width dimensions
of the image uploaded. If the image is blurry or stretched out, then
a new image with the accurate dimensions will need to be uploaded. Most themes have different recommendations
on the image size, so make sure to read the theme documentation to find the optimal size
for your theme. The Brooklyn theme slideshow recommends an
image size of 3840 X 2160 pixel or larger. For Shopify themes, you can find these details
by using the link in the description below. Finally, a crucial factor of a well-done slideshow
is understanding the difference in how the image is portrayed on different devices. Shopify Themes are developed in regards to
mobile, desktop, and everything in between. You can preview what the slideshow looks on
different devices by selecting one of the device icons at the top of the page. Each of these devices automatically adjusts
the image for its screen. On full-width images, the picture will often
crop on the sides. For this reason, make sure to test your images
on mobile as well as desktop when designing your storefront. For more tutorials on navigating Shopify themes,
subscribe to the Shopify Help Center Youtube channel for weekly updates. Feel free to comment below, Shopify would
love to hear from you!