Recommended image sizes for the slideshow

Recommended image sizes for the slideshow

Our theme allows you to upload different images for the slides on desktop versus on mobile. Then you can decide if you display those images on desktop only, desktop & mobile or mobile only.

Desktop image sizes recommended

FLEXIBLE SLIDESHOW SECTION

Below we list the recommended dimensions for each height of the flexible slideshow:

Slider Height    Desktop     Mobile
Large            2048x780    750x1170
Medium           2048x520    750x780
Small            2048x400    750x700
Extra Small      2048x250    750x400

Try to place the content carrying the semantic load in the center of the image, this will ensure that useful information will be displayed on all kinds of devices.
Ideally, don't put important elements at the border of the slideshow images. They might be cut on certain devices
from different sizes. For example, it is possible that the picture will be cropped on the sides in this 
range eg. 10-15%. You can be creative with it and use some background/gradients magic to make it look perfect on all devices.

FIXED SLIDESHOW SECTION

Desktop: 2048x780
Mobile: 750x960

For the horizontal logos, 
ideal ratio is 4:1 (eg. 220 x 55 pixels)
.The size is adjustable in the theme settings inside "Customize Theme > Header". Height could be between 55-60px, but if you put a 120px height, the theme will adjust it. As for the width, it could be between 100-300px. 

For the vertical logos, which means a "higher" logo (bigger in height than in width), you can go to Customize Theme > Theme Settings > Layout > Tall Header. The height could be between 55-120 px. As for the width, it could be between 100-300px. 

    • Related Articles

    • Add a video instead of an image in the product page's main images slideshow

      We want to display our video intro in all the product pages right before the main image shows up. The video link is: https://youtu.be/DGGouJ4F_kU Sample product page: https://www.fadstop.com/products/2018-best-selling-adorable-talking-hamster How can ...

    • Latest releases of the Konversion theme

      Versioning logic - Version X.Y.Z X means a major change in theme due to a change in Shopify's core Y means a big enough change that involves new key features and/or big change/fix X means small bug fixes and small features release. Make sure you have ...

    • Option to add a background image on all pages

      QUESTION How can I add a background image to reproduce what I had in my previous Shopify theme? ANSWER Go to Customize Theme > General Settings > Layout There is 3 new options for the background: Image pattern Full size image Custom gradient.

    • Display Trust Badges in your Product Pages of your Shopify Store

      With the Konversion theme, you can upload your own trust icons, and now you can also upload your own image for trust/security/conversion badge.  By default, we provide the trust badge image below for free. But you can change the trust badge image and ...

    • How to add custom colors into the color swatches for variants/options on the product page

      When I add a single color name like red, green it works fine but when the color name is like dark grey, indigo blue it's not showing up any color? You need to create custom colors from theme settings. If you want to define the Dark grey color, please ...