A new Image Gallery Component is available in the CLF4 template. While the key component options remain the same as in the previous version, there are important differences in display styles and functionality.

Please note that only one Image Gallery Component can be added on a page.

Image selection

The new Image Gallery Component creates canvas based on the max width and max height of the widest and highest image. To optimize the display of your Image Gallery or Slideshow, use horizontal images with a 3:2 aspect ratio that are 2000px wide. 

• If your images are smaller than 2000px in width and are viewed on larger screens, grey background will appear to the left and right of the image
• If you use horizontal images of different aspect ratios, grey background background will appear around, on top and bottom or left and right of some of the images to match the aspect ratio of the component canvas
• To use a portrait image, resize it to match the height of the heighest landscape image, then canvas, using transparent background, to match the width of the widest image in the gallery. Save the image as a PNG

Slideshow display

The slideshow automatically plays your images for a duration of 5 seconds each. The user can pause the slideshow anytime by clicking on the image or the pause button. Clicking on the image again or the play button restarts the slideshow. If less than 50% of the slideshow is visible on the screen, the slideshow automatically pauses and then restarts when more than 50% of it becomes visible.

Image Gallery display

The image gallery displays a feature image with five thumbnails placed below. The user can navigate between images by clicking on thumbnails, arrows or swiping the feature image on touch screens.