Picture-Grid
Das Picture-Grid ist ein Text-Media Element mit dem Erscheinungsbild "Picture-Grid".
Dieses Element ist (fast) immer das erste Element in der rechten Spalte (2 Spalten-Sektion) im Inhaltsbereich, direkt unter dem Header. Es überlagert den Header zum Teil automatisch.
Das Picture Grid kann bis zu 3 Bilder enthalten. Zudem gibt es die Varianten "vertikal" und "horizontal".
Im Button im Picture-Grid können Verlinkungen zu anderen Seiten, externen URLs und Bildergalerien hinterlegt werden. Zusätzlich kann die Farbe des Buttons über die Auswahl einer Kategorie angepasst und ein Icon hinzugefügt werden.
In dem rechten Beispiel wurde eine Verlinkung mit Icon hinzugefügt. Durch die Auswahl der Kategorie "Familie" ist der Button zusätzlich gelb eingefärbt.
Icons können durch die Angaben
- :family: (Familie)
- :culture: (Kultur)
- :hospitality: (Gastlichkeit)
- :active: (Aktiv)
- :events: (Veranstaltungen)
- :north-eifel: (Nord-Eifel)
im Text hinzugefügt werden.
Im rechten Beispiel wurde die Angabe ":family: Verlinkung mit Icon" eingetragen.
Wird ein zweites Bild hinzugefügt, wird dieses als kleines quadratisches Bild links unten angezeigt.
Das Picture-Grid mit 3 Bildern gibt es in zwei Varianten.
Entweder mit einem vertikalen ...
... oder horizontalen Trenner zwischen den beiden ersten Bildern.
Natürlich können alle Picture-Grid-Elemente auch ohne eine Verlinkung (Button) genutzt werden.