Galerie-Einstellungen

In der Galerie-Komponente kannst du festlegen, wie deine Bilder angezeigt und animiert werden.

Im Folgenden werden alle Einstellungsoptionen kurz erklärt:

Initial Slide

Legt fest, mit welchem Bild die Galerie startet.

• Wert: Zahl (z. B. 0 = erstes Bild, 1 = zweites Bild usw.)
• Tipp: Praktisch, wenn du eine Galerie mehrfach nutzt und mit unterschiedlichen Startbildern beginnen möchtest.

Speed (ms)

Bestimmt die Animationsgeschwindigkeit beim Wechsel zwischen zwei Slides.

• Wert: 300 (Millisekunden)
• Bedeutung: Je kleiner der Wert, desto schneller erfolgt der Übergang.
• Empfehlung: 300–600 ms sorgen für eine flüssige, aber zügige Animation.

Effect

Legt den Übergangseffekt beim Slide-Wechsel fest.

Optionen:

• slide – klassischer horizontaler Übergang
• cube, coverflow, flip – 3D-Effekte
• Empfehlung: Für Galerien mit vielen Bildern ist slide am performantesten.

Space Between (px)

Definiert den Abstand zwischen den Slides.

• Wert: 20 px
• Tipp: Etwas Abstand sorgt für eine klare visuelle Trennung – besonders bei mehreren Bildern nebeneinander.

Slides Per View

Bestimmt, wie viele Bilder gleichzeitig angezeigt werden.

• Wert: 4
• Tipp: Ideal für Desktop-Ansichten oder Kachelgallerien.

Bei kleineren Screens wird dieser Wert über Breakpoints automatisch angepasst.

Centered Slides

Wenn aktiviert, wird der aktive Slide in der Mitte zentriert dargestellt.

• Tipp: Ideal für Karussells mit hervorgehobenem Fokus auf das mittlere Bild.

Loop

Aktiviert das endlose Durchlaufen der Galerie.

• Bedeutung: Nach dem letzten Slide springt die Galerie automatisch wieder zum ersten.
• Tipp: Empfehlenswert für Galerien ohne klaren Anfang oder Ende (z. B. Referenzen oder Logos).

Autoplay

Startet die Galerie automatisch, ohne dass Nutzer:innen wischen oder klicken müssen.

• In Verbindung mit Autoplay Delay kannst du festlegen, wie lange jedes Bild sichtbar bleibt.

Autoplay Delay (ms)

Aktiviert die automatische Wiedergabe der Slides und legt die Dauer pro Slide fest.

• Wert: 5000 ms (= 5 Sekunden)
• Tipp: Funktioniert nur, wenn Autoplay aktiviert ist.

Ideal für Header-Slideshows oder Intro-Sektionen.

Breakpoints

Hier kannst du responsives Verhalten definieren – also unterschiedliche Einstellungen je nach Bildschirmbreite.

Im Beispiel:

Ab 520 px Breite:

• Slides Per View: 1
• Space Between: 0

Das bedeutet:

Auf kleinen Bildschirmen (z. B. Smartphones) wird ein Bild pro Slide angezeigt, ohne Abstand dazwischen.

Aktualisiert am: 07/11/2025