Der Introbereich wird automatisch mit einer vordefinierten Farbe hinterlegt, die dem Bereich der Website entspricht (z. B. blau beim Bürgerportal). Die Schriftfarbe ist weiß. Der Bereich ist optional. Wenn keine Inhalte angelegt werden, erscheint auch keine Farbfläche.
Text-Ausrichtung und Laufweite
Normaler Text hat eine Maximalbreite von 800 Pixel und links und rechts einen Mindest-Außenabstand von 5% der Browserbreite.
mittige Ausrichtung der Überschrift
Text-Element mit Layout "keine Einrückung"
Dieser Text hat keine Maximalbreite, sondern nur den Außenabstand von 5%. Diese Layout-Option eignet sich gut für Überschriften von Zweispaltern:
Dieses Text-Inhaltselement hat die Größen-Option "50% Element". Folgt hierauf ein weiteres Element mit derselben Option, stehen beide Elemente nebeneinander. In der mobilen Ansicht stehen beide Elemente bis zu einer Browserbreite von 500 Pixel untereinander.
Es dient hier nur zur Visualisierung der 50% Funktion,
wie sie z. B. auch für Karten genutzt werden kann.
Zweispaltiger Text (mittels RTE)
Mittels Button in der Toolbar des RTE lässt sich ein Zweispalter erzeugen:
Inhalt der linken Spalte
Inhalt der rechten Spalte
H2 Sub-Headline
H3 Sub-Sub-Headline
H4 Sub-Sub-Sub-Headline
H5 Sub-Sub-Sub-Sub-Headline
Fließtext
Trennlinie:
Tabelle:
Montag | 08:30 - 12:00 Uhr |
Dienstag | 08:30 - 12:00 Uhr 14:00 - 18:00 Uhr |
Mittwoch | 08:30 - 12:00 Uhr |
Animierter Text
Für Textelemente stehen verschiedenste Animation zur Auswahl, die im jeweiligen Inhaltselement über den Karteireiter Animation gewählt werden können. Die Animation wird ausgelöst, sobald das Element beim Scrollen in den Viewport kommt.
Badges
Die folgenden Badges werden als Überschriften angelegt und stehen dort als Typ-Option zur Auswahl. I.d.R. sollte die Option "Farbe gemäß Farbklima der Seite" gewählt werden. So hat es automatisch den zur Seite passenden Farbton. Bei Übersichtsseiten kann ein abweichender Farbton gewählt werden, wenn inhaltlich auf einen anderen Bereich der Website verwiesen wird.
Farbe automatisch
Neutral
Bürger, Stadt, Verkehr
Tourismus
Öffentliches Leben
Kultur & Sehenswertes
Genuss & Regionalität
Natur & Freizeit
Im Kontrastmodus sind alle regulären Badges automatisch dunkelgrau, und alle Badges im Inhaltselement Vollbild automatisch weiß.
Link-Buttons
Die Link-Buttons gibt es in zwei verschiedenen Stilen ("Download" + "mehr") und jeweils 7 verschiedenen Farben. Wenn der Farbton "auto Farbe" gewählt wird, erscheint der Button im Frontend automatisch im zum Farbklima der Seite passenden Farbton (im RTE wird ein solcher im neutralen Farbton dargestellt).
Die Zoom-Animation startet, sobald das Element zum ersten Mal in den Viewport kommt.
Kacheln
Ohne Icon
Kacheltext
zweite Zeile
Mit Icon
Fließtext
Mit Link
Fließtext
Kachel Vier
eigentlich sollten es ja
nicht mehr als drei sein
Mit Icon + Link
Fließtext
Layout
Neutral
Layout
Bürger, Stadt, Verkehr
Layout
Tourismus
Layout
Öffentliches Leben
Layout
Kultur & Sehenswertes
Layout
Genuss & Regionalität
Layout
Natur & Freizeit
Außer dem Intro gibt es noch diesen zusätzliche Inhaltsbereich, der in der Hintergrundfarbe des jeweiligen Website-Bereiches hinterlegt ist. Dieser Inhaltsebereich ist optional und muss nicht genutzt werden. AIm Anschliss steht noch ein weiterer Bereich mit weißem Grund zur Verfügung.
Kacheln auf farbigem Grund
Aufklapper auf farbigem Grund
Aufklappelement
Fließtext in der linken Spalte.
Neue Absatz.
Fließtext in der rechten Spalte.
Aufklappelement Zwei
Fließtext
Aufklapper
Aufklappelement Drei
Fließtext
Aufklappelement Vier
Fließtext
Formular
Datensätze einfügen
Akkordeon
Fließtext 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. 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. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
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. 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. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
Fließtext 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. 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. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
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. 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. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
Karten
Koordinaten-Finder (Klick zeigt Koordinaten):