Galerie

Mit dem Inhaltselement „Galerie“ stellen Sie mehrere Bilder als Vorschaubilder dar. Beim Klick öffnet sich die Großansicht in einer Lightbox (mit Navigation und Bildzähler); in der Lightbox wird die Bildquelle und optional eine Caption/Bildbeschreibung angezeigt.

Seitentypen: alle 
Position: frei innerhalb der Inhaltsspalte 

Funktion: mehrere Bildausschnitte zeigen + Vergrößerung in Lightbox 

Inhalte & Grenzen:

• mind. 2 Bilder, je Bild mind. 1024 × 768 px 
• Bildquelle (max. 100 Zeichen) 
• Caption/Bildbeschreibung (max. 300 Zeichen, optional) 
• Thumbnail-Größe 134 × 134 px 

Wichtig zur Darstellung (Thumbnails):
Thumbnails werden quadratisch (1:1) erzeugt; dabei wird rechts in der Breite und mittig in der Höhe beschnitten. 

Varianten:

• Standard: Kacheln nebeneinander, max. 6 Bilder pro Zeile 
• Slider: einzeiliges Thumbnail-Band mit Links/Rechts-Buttons 

Container-Hinweis: Die Galerie ist aktuell in Containern nicht erlaubt.

• Galerie, wenn mehrere Bilder gleichrangig sind und Nutzende sie bei Bedarf in der Lightbox durchklicken sollen. 
• Text mit Bild / Spaltenbreites Bild, wenn ein einzelnes Bild (oder Bild+Text-Kontext) im Vordergrund steht.

Schritt 1: Element einfügen & Variante wählen

• „+ Inhalt“ → Galerie
• Variante Standard oder Slider auswählen.

Schritt 2: Bilder hinzufügen

• Bilder können per Mehrfachauswahl hinzugefügt werden. 
• In der Vorschau können Bilder mit den Pfeiltasten manuell sortiert werden. 
• Gleiche Bilder können erneut geladen werden (Duplikate sind möglich). 

Schritt 3: Bildbeschreibung & Quelle pflegen (empfohlen)

• Alternative Bildbeschreibung (Alt-Text): empfohlen (für Barrierefreiheit; idealerweise an der Datei in FAL pflegen). 
• Quellentyp (Foto/Bild/Quelle) wählen und Bildquelle eintragen. 
• Optional: Bildunterschrift (Caption) je Bild (max. 300 Zeichen). 

• Rechnen Sie mit dem quadratischen Thumbnail-Zuschnitt: Motive so wählen, dass Wichtiges nicht am rechten Rand hängt und in der Höhe zentriert gut wirkt. 
• Wenn der Ausschnitt ungünstig ist: Cropping nutzen und in der Vorschau/Frontend prüfen.