Image gallery

An image gallery displays multiple images as thumbnails. When a user clicks on a thumbnail, the image can be viewed in a larger size. Image galleries are created using the “Text & Media” content element.

Image preparation

For detailed instructions on preparing images, see the Images guide.

Creating an image gallery – step by step

1. Create a new “Text & Media” content element.
2. Switch to the “Media” tab.
3. Click “Add Media File” and select all images you want to include in the gallery.
4. Enable “Enlarge on Click” so that images can be viewed in a larger size when selected.
5. Set the thumbnail width (e.g., 350 px).
6. Set the desired number of columns (e.g., 3 to display three images side by side).
7. Click Save.

Gallery settings

Setting	Recommendation
Thumbnail width	Specify only the width (e.g., 350 px). The height will scale automatically to maintain the image proportions.
Number of columns	Use 2 - 4 columns for typical image galleries.
Enlarge on click	Enable this option to provide a lightbox view when users click an image.

Captions

To add individual captions, click on an image in the media list and enter the desired text in the “Caption” field. Each image can have its own caption, which will be displayed below the image in the frontend.

Sorting images

You can change the order of images in the media list by dragging and dropping. Simply click and hold an image, then drag it to the desired position. The gallery or image list will be displayed in the same order on the website.

Example