Skip to main content

Gallery Component

Display multiple images or videos as a slider and present visual content in a clickable gallery.

Updated over 2 weeks ago

he Gallery Component is used to display multiple visual elements within a carousel. Unlike the Image Component, it does not show a single image, but a sequence of media items that can be navigated manually.

As usual, a headline and subheadline can optionally be displayed. The layout principles and color scheme behave identically to the Image Component.

The gallery displays one medium at a time and automatically adjusts its height to the currently active element.


Structure of a Gallery Item

Each gallery item can contain one of the following visuals:

  • an image

  • a video from the Media Archive

  • a web video

For images, cropping and focus can be adjusted and reset if needed.

A caption can be added below the medium. It is managed via a rich text editor and can be formatted and linked.

Important Note on Image Formats

Since the component adjusts its height to match the currently displayed medium, different aspect ratios may result in visible height changes. This can create a visually unstable effect when sliding between items.

It is therefore recommended to prepare all images in the same format before uploading them to the Media Archive.

While the integrated cropping tool can be used to adjust images afterward, this method is less precise and may lead to inconsistencies when working with multiple elements. For a clean result, image proportions should be standardized in advance.


Lightbox

A lightbox can optionally be activated. This enlarges the respective medium when clicked but does not change the fundamental layout of the gallery.


Tips & Tricks

  • Use consistent image formats for smooth slider behavior.

  • Define image aspect ratios before uploading them.

  • Ensure videos match the format of the rest of the gallery.

  • Test the slide behavior before publishing.

Did this answer your question?