Beispiele für den Einsatz von Bildern und Galerien
Statische Bildergalerie (Variante A)
Text & Medien Element mit 5 Bildern, Galerieeinstellung: 5 Spalten
Statische Bildergalerie (Variante B)
Container mit 5 Spalten, pro Spalte ein Text & Medien Element mit je einem Bild
Text auf Bild
Container mit 2 Spalten, pro Spalte ein Text & Medien Element mit je einem Bild, ausgewählter Rahmen: Text auf Bild
Text auf Bild
Runde Bildform
Container mit 3 Spalten, pro Spalte ein Text & Medien Element mit je einem Bild, ausgewählter Rahmen: Runde Bildform
FlipBox
Container mit 2 Spalten, pro Spalte ein Text & Medien Element mit je einem Bild, ausgewählter Rahmen: Flipbox
FlipBox
Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.
- Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
- Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.
- Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.
FlipBox
Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
Media/Brandwall
transparente Colorbox (volle Breite) mit zwei 6-Spaltern (Inhalte vertikal zentriert) und einem 3-Spalter (Inhalte vertikal zentriert); darin pro Spalte ein Text & Medien Element mit je einem Bild; wechselseitige Animation pro Spaltenelement
Colorbox mit Hintergrundbild und überlagerndem Contentbild
Colorbox mit Hintergrundbild und überlagerndem Contentbild
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Hier klicken
Colorbox mit Hintergrundbild und überlagerndem Contentbild
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Hier klicken
2 Spaltenelement Option "Bilder auf eine Höhe ziehen"
- Um zwei unterschiedliche Bildformate im Content auf eine Höhe zu ziehen, werden diese in einem 2 Spaltenelement plaziert und die Option "Bilder auf eine Höhe ziehen" ausgewählt.
- Beide Bildformate sollten zur rersponsiven Darstellung mindestens 800px Breit sein. Das breitere Bildformat wird dabei in der breiten Spalte plaziert und umgekehrt (abgesehen von der Aufteilung 50/50).
- Im folgenden Beispiele beginnend mit den Ausgangsformaten ohne ausgewählter Option, dann mit 50/50, 60,40, 66/33 und 25/75 Aufteilung.
50/50 OHNE Option "Bilder auf eine Höhe ziehen"
50/50 mit Option "Bilder auf eine Höhe ziehen" (halbe Höhe)
60/40 mit Option "Bilder auf eine Höhe ziehen"
66/33 mit Option "Bilder auf eine Höhe ziehen" (1,5 fache Höhe)
25/75 mit Option "Bilder auf eine Höhe ziehen"
33/33/33 mit Option "Bilder auf eine Höhe ziehen"
15/70/15 mit Option "Bilder auf eine Höhe ziehen"
25/50/25 mit Option "Bilder auf eine Höhe ziehen"
25/25/50 mit Option "Bilder auf eine Höhe ziehen"
50/25/25 mit Option "Bilder auf eine Höhe ziehen"
4 Spalten mit Option "Bilder auf eine Höhe ziehen"
5 Spalten mit Option "Bilder auf eine Höhe ziehen"
Colorbox Optionen: "Bild ohne Rand" vs. "Innenabstand entfernen" (Alle)
colorbox-fullwidth-content fullwidth-mode-1 transparent colorbox--no-padding-top colorbox--no-padding-bottom colorbox--no-padding-left colorbox--no-padding-right
colorbox-fullwidth-content fullwidth-mode-1 fullwidth-image