Textblock mit Template "Standard"
Pflegeanleitung nach Backoffice-Feldern:
- Überschrift Typ: hiermit kann man für das Betreff-Feld einen Überschrift-Typ (
H1-H6) festlegen. Default istDIVund sieht aus wie eine H1. - Betreff: stellt die primäre Überschrift.
- Zusatzzeile: stellt die sekundäre Überschrift und ist optisch wie H3 definiert.
- Bild: Stellt ein Bild dar. Wo und wie ist templateabhängig. Das Responsive-Image-Setting kann überschrieben werden.
- Inhalt: liefert den Textkörper. Die Ausgabe kann je nach gewähltem Template leicht abweichen.
- Link: Stellt einen Button unter dem Inhalt dar, wenn Portaltyp, -objekt und Link Titel gepflegt sind.
Alle Felder sind Optional.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Textblock Template: §T1
Die Typografische Ausgabe von §T1 in allen Varianten ist identisch zu Textblock "Standard".
Die Varianten §T1-a, -b, -c und -d geben die Positionen der Bilder an. Für -c und -d gibt es noch Untertypen, die durch Zahlen angeben, wie die Breitenverteilung der Spalten ist - in halbe, drittel, viertel.
- §T1-a: Bild oben, Text unten
- §T1-b: Text oben, Bild unten
- §T1-c: Bild links (auto), Text rechts
Das Bild selbst definiert hier die Breite der linken Spalte. - §T1-c2: Bild links (1/2), Text rechts (1/2)
- §T1-c3: Bild links (1/3), Text rechts (2/3)
- §T1-c4: Bild links (1/4), Text rechts (3/4)
- §T1-d: Text links, Bild rechts (auto)
Das Bild selbst definiert hier die Breite der rechten Spalte. - §T1-d2: Text links (1/2), Bild rechts (1/2)
- §T1-d3: Text links (2/3), Bild rechts (1/3)
- §T1-d4: Text links (3/4), Bild rechts (1/4)
Mögliche Modifikatoren über den Template CSS Dialog
- §T1 grid gap normal (default)
- §T1 grid gap small
Stellt den Abstand zwischen den Spalten auf 15px. - §T1 no grid-gap
Stellt den Abstand zwischn den Spalten auf 0. - §T1 image/text vertical align bottom
Für -c und -d werden hiermit die Bild- und Textspalte an deren Unterkante ausgerichtet - §T1 image/text vertical align center
Für -c und -d werden hiermit die Bild- und Textspalte zueinander vertikal zentriert - §T1 image centered
Zentriert das Bild horizontal in seiner Spalte. - §T1 texts centered
Zentriert den Text horizontal in seiner Spalte.
Hier sind §T1-a und §T1-b eingebunden.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Bei §T1-c und §T1-d definiert jeweils das Bild die Breite der Bildspalte.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Die Untertypen von §T1-c und §T1-d stellen richten sich nach dem Grid.
- c2 und d2 teilen sich 1/2 zu 1/2 auf,
- c3 und d3 je 1/3 Bild zu 2/3 Text,
- c4 und d4 je 1/4 Bild zu 3/4 Text
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.
Primäre Überschrift
Sekundäre Überschrift
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: Beispiel-Link.