Venue - Sections - Prevent your slideshow images being cropped
On earlier versions of the Venue theme the slideshow section can sometimes 'crop' or hide some parts of the image depending on how wide your visitor's browser is on desktop. From version 4.8.3 onwards we've changed how the slideshow works so that the images will maintain a consistent ratio thus significantly reducing the chances that part of your image will be hidden.
A. Change the height of your slideshow section
Inside the Theme editor > Slideshow section you can find a setting called Section height. You can choose from Small, Medium and Large section heights.
B. Edit your images to a preferred desktop ratio/size
If you adhere to the following guidelines your images will not be cropped/hidden in the slideshow section - regardless of the width of the viewer's browser.
Desktop dimensions
Use Photoshop or similar to edit your images to these recommended sizes.
- Small section height - Ideal image dimensions would be 2200px by 880px for desktop. This displays as a ratio of 5:2 on desktop and will be displayed as 1:1 (square) on mobile.
- Medium section height - Ideal image dimensions would be 2200px by 1100px for desktop. This displays as a ratio of 2:1 on desktop and will be displayed as 4:5 on mobile.
- Large section height - Ideal image dimensions would be 2200px by 1375px for desktop. This displays as a ratio of 16:10 on desktop and will be displayed as 10:14 on mobile.
C. Fine-tune your mobile images (optional)
If you are not happy with the way the section responds and 'crops' your desktop images when your slideshow is viewed on a mobile device you can upload an image 'override' that is only used for mobile widths. Sometimes the placement of the main subject of your photo isn't where you want it when viewed on a mobile device. You can find this image upload option inside each individual slide in your slideshow.
Use these guidelines to edit and upload a mobile image you are happy with.
Mobile dimensions
- Small section height - Ideal image dimensions would be 1200x by 1200px for mobile. This displays as a ratio of 1:1 (square).
- Medium section height - Ideal image dimensions would be 1200px by 1500px for mobile. This displays as a ratio 4:5.
- Large section height - Ideal image dimensions would be 1400px by 1960px for mobile. This displays as a ratio of 10:14.
