Container muted

ERROR: Content Element with uid "35" and type "gridelements_pi1" has no rendering definition!

cover, center center, scroll, parallax

cover, fixed, center center, overlay

ERROR: Content Element with uid "41" and type "gridelements_pi1" has no rendering definition!

cover, center center

Container secondary, großer innerer Abstand

Container primary, kleiner innerer Abstand

Container default

zentriert

In den Erweiterungsoptionen "Section" finden sich Einstellungsmöglichkeiten für die Positionierung des Inhalts.

  1. Die Option "Container zentrieren?" gibt dem Container (und damit auch dem Inhalt) eine maximale Breite und zentriert ihn horizontal.
  2. Die Option "Breite des Containers" bieten die Möglichkeit, diese maximale Breite anzupassen. Expand beudetet, dass der Container keine feste Breite bekommt, aber dennoch einen horizontalen Innenabstand.

Für das Gridelement "Col - Section" gibt es noch weitere Möglichkeiten:

  1. Neben der Option "Breite des Containers" kann auch eine prozentuale Breite gewählt werden. Wenn hier eine Auswahl getroffen wird, muss der Toggle "Ausrichtung Inhalt" umgeschaltet werden, wenn der Containerinhalt horizontal zentriert werden soll.
  2. Die Option "Mindesthöhe für Container" ermöglicht das festlegen einer Höhe des Containers, die dieser mindestens haben wird.
  3. Die Option "Inhalte im Container vertikal anordnen" ermöglicht es den Inhalt im Container vertikal auszurichten. Die Inhalte können oben, mittig oder unten angeordnet werden.
  4. Die Option "Developer ID" vergibt dem Container eine ID, die mittels Ankerlinks ansprechbar ist. Eine ID darf nur einmal auf einer Seite vorkommen und darf keine Leerzeichen oder Umlaute beinhalten. Außerdem wird zwischen Groß- und Kleinschreibung unterschieden [Bsp.: kontakt]. In einer URL kann der Anker mit #ID angesteuert werden [Bsp.: domain.de#kontakt].

Spalten, Container und Grids

Spalten, Container und Grids erzeugen eine Struktur, in der Inhalte eingefügt werden können. Es stehen 1-6 Spalten und ein dynamisches Grid zur Verfügung.

ERROR: Content Element with uid "54" and type "gridelements_pi1" has no rendering definition!

Container small, zentriert

Gleiche Höhe für Spalten

Den Spalten der Container können Erscheinungs-Animationen hinzugefügt werden.

  1. Wenn die Option "Alle Child-Items animieren?" aktiviert ist, können die Animationen noch konfiguriert werden.
  2. Die aktivierte Option "Animationen wiederholen?" startet die Erscheinungs-Animation jedes Mal, wenn die Spalten in den Viewport kommen. Ist die Option deaktiviert wird die Aniamtion nur beim ersten Erscheinen ausgeführt.
  3. Die Option "Delay" regelt die Verzögerung des Animationsstarts in Millisekunden (1000ms = 1s)
  4. Im Tab "Animation Columns" kann die gewünschte Animation für jede Spalte ausgewählt werden.

ERROR: Content Element with uid "69" and type "gridelements_pi1" has no rendering definition!

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Vertikale Ausrichtung: zentriert, großer Spaltenabstand

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

ERROR: Content Element with uid "73" and type "gridelements_pi1" has no rendering definition!

  1. Die Option "Gleiche Höhe für alle Spalten" bringt alle Spalten eines Containers auf die gleiche Höhe. Basis dafür ist immer die längste Spalte. Die fortgeschrittenere Variante ist das Nutzen des Feldes "Gleiche Höhe für bestimmte Items" in dem eine CSS Klasse eingetragen werden kann. Die Elemente innerhalb des Containers mit dieser Klasse werden auf die gleiche Höhe gebracht.
  2. Die Option "Abstände zwischen den Spalten" ermöglicht unterschiedlich große Abstände zwischen den Spalten.
  3. Die Option "Mindesthöhe für Container" ermöglicht das festlegen einer Höhe des Containers, die dieser mindestens haben wird.
  4. Die Option "Inhalte im Container vertikal anordnen" ermöglicht es den Inhalt im Container vertikal auszurichten. Die Inhalte können oben, mittig oder unten angeordnet werden.
  5. Die Option "Developer ID" vergibt dem Container eine ID, die mittels Ankerlinks ansprechbar ist. Eine ID darf nur einmal auf einer Seite vorkommen und darf keine Leerzeichen oder Umlaute beinhalten. Außerdem wird zwischen Groß- und Kleinschreibung unterschieden [Bsp.: kontakt]. In einer URL kann der Anker mit #ID angesteuert werden [Bsp.: domain.de#kontakt].

ERROR: Content Element with uid "75" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "76" and type "gridelements_pi1" has no rendering definition!

  1. Die Breite der einzelnen Spalten kann für verschiedene Geräte-/Browsergrößen angepasst werden. Ist die Summe größer als 1, werden die Spalten in eine neue Zeile umbrechen.
    Als Orientierung gilt:
    1. default = alles kleiner als Tablets im portrait Modus
    2. small = Tablets im portrait Modus
    3. medium = Tablets im landscape Modus
    4. large = Laptops
    5. xlarge = Desktop Rechner
  2. Im Tab "Sichtbarkeit" kann das ganze Element, oder auch einzelne Spalten, auf bestimmten Größen ausgeblendet werden.

ERROR: Content Element with uid "78" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "79" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "80" and type "gridelements_pi1" has no rendering definition!

Den Containern können Hintergrundbilder hinzugefügt werden.

  1. Das Bild wird in den Grid Element Eigenschaften "Erscheinungsbild" im Bereich "Dateien" hinzugefügt.
  2. In den Plugin Optionen unter "Container Style" kann dann eingestellt werden, wie der Hintergrund positioniert werden, welche Größe er haben und ob er sich wiederholen soll.
  3. Das Hintergundbild kann außerdem fixiert werden, oder mitscrollen.
  4. Es besteht die Möglichkeit, ein Overlay zu erzeugen, welches sich zwischen Bild und Text legt.

ERROR: Content Element with uid "82" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "83" and type "gridelements_pi1" has no rendering definition!

contain, center center

  1. Die Option "Hintergrund Presets" enthält verschiedene Presets, die unterschiedliche Hintergundfarben erzeugen. Sollte ein gewünschter Hintergrund nicht vorhanden sein, kann im "Hintergrundfarbe" ein eigener Wert eingetragen werden. Zulässige Formate sind Hex (#000000), rgb (rgb(0,0,0)), rgba (rgba(0,0,0,1)) und hsl (hsl(0, 100%, 0%)).
  2. Ganz unten im gleichen Options-Tab gibt es die Möglichkeit, mit der Option "Heller Text" die Schriftfarbe im Container zu invertieren.
  3. Die Option "Innerer Abstand" enthält verschieden Werte für den inneren Abstand das Containers zu seinen Inhalten.

ERROR: Content Element with uid "86" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "87" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "90" and type "gridelements_pi1" has no rendering definition!

Slide von unten, wiederholen

kurzer Slide von rechts

3. Spalte

klein: 1/2
medium: 1/2
large: 1/3
xlarge: 1/3

ERROR: Content Element with uid "100" and type "gridelements_pi1" has no rendering definition!

volle Breite

ERROR: Content Element with uid "34" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "38" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "53" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "56" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "58" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "59" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "60" and type "gridelements_pi1" has no rendering definition!

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.

ERROR: Content Element with uid "63" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "64" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "65" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "66" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "67" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "89" and type "gridelements_pi1" has no rendering definition!

Slide von links, wiederholen

Fade in

2. Spalte, sichtbar ab groß

ERROR: Content Element with uid "96" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "33" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "37" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "52" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "88" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "91" and type "gridelements_pi1" has no rendering definition!

1. Spalte

klein: 1/2
medium: 1/2
large: 1/3
xlarge: 1/3

ERROR: Content Element with uid "32" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "36" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "51" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "50" and type "gridelements_pi1" has no rendering definition!

Spalten, Container und Grids

ERROR: Content Element with uid "29" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "28" and type "gridelements_pi1" has no rendering definition!

ERROR: Content Element with uid "27" and type "gridelements_pi1" has no rendering definition!