Kategorie –
Konfiguration Komponenten

5. Weise der Section die Komponente Header with slanted image über "Add block" hinzu und füge eine (kurze knappe) Headline und einen Text ein. Als "Background color of slant" wird "Box Grey" ausgewählt.

6. Wähle ein Bild aus der Mediendatenbank aus oder füge ein neues über "Datei auswählen" hinzu (2560 x 1707 px). 

7. Damit das Headerbild auf anderen Geräten (Smartphone, Tablet) responsiv ausgespielt werden kann, müssen die entsprechenden Bildausschnitte über "Edit" definiert werden.

8. Über "Crop image" wählst Du die Ausschnitte für die einzelnen Seitenverhältnisse aus. Klicke hierzu durch die horizontalen Tabs (Bsp.: Crop 16:9, Crop 2:3, etc.)

1. Füge die Section Cards: Two Columns Routing (Special) hinzu. 

2. Wähle die Einstellungen für die Section. Definiere das "Administrative label" mit Cards: Two Columns Routing (Special) für eine bessere Übersicht im Backend. 

3. Füge jeder Spalte (Column) die Komponente Card über "Add block" hinzu. Diese besteht aus einem SVG-Icon, einer Headline, einem Text sowie einem Button (Link). Das Design der Cards ist fest definiert, wähle immer ein dunkles SVG-Icon.

Siehe hierzu auch den Hinweis zu internen Verlinkungen.

1. Füge die Section Image with optional overlay text hinzu. 

2. Gehe in die Einstellungen für die Section und aktiviere die Hintergrundfarbe "Transparent" unter "Background color". Wähle unter "Is image bright or dark?", ob das eingefügte Bild eher hell oder dunkel ist. Eine optionale Headline wird entsprechend farblich ausgegeben und kann besser gelesen werden. Definiere das "Administrative label" mit Image with optional overlay text für eine bessere Übersicht im Backend. 

3. Füge der Section über "Add block" eine Komponente hinzu. 

4. Wähle ein Bild aus der Mediendatenbank oder füge ein neues über "Datei auswählen" hinzu (2560 x 1440 px). Wenn Text über dem Bild liegen soll, so füge diesen unter Headline Text ein und wähle vorab unter "Headline Hierarchy" "H2" aus.

4. Wähle als Hintergrundfarbe "White" und setze einen Haken bei "with centered content" und "With shadow", sodass der Text zentriert und mit Schlagschatten dargestellt wird. 

5. Füge eine kurze (!) Headline hinzu und wähle die "Headline Hierarchy" "H3" aus (sollte sie nicht bereits voreingestellt sein) und füge einen kurzen und prägnanten Text hinzu.

6. Wähle eine "URL" und den entsprechenden "Link text" aus – dieser sollte bestenfalls nicht mehr als zwei Wörter enthalten.

7. Speichere diese Karte ab und fülle nach dem gleichen Verfahren die nächste Karte aus.

Hinweis:
Nutze bei internen Verlinkungen innerhalb der DEHN-Websites (URL) den entsprechenden Seiten-Titel, wenn dieser bekannt ist. Siehe hierzu auch den Hinweis zu internen Verlinkungen.

4. In den Einstellungen der Komponente FAQs with Filter, kann der "Floating button", mit Sprungmarke zu den FAQ, per Checkbox aktiviert werden. Dieser erscheint dann am rechten Bildschirmrand.

5. Um die FAQ thematisch zu strukturieren, kann ein Filter über das Feld "Filter categories" eingesetzt werden. Die Kategorienamen werden mit einem Komma getrennt hier eingetragen. Jede FAQ kann anschließend einer dieser Kategorien zugeordnet werden.

6. Jede FAQ benötigt eine Frage und eine Antwort – auch hier wird ein kurzer knapper Text empfohlen, ggf. kann ein Link zu mehr Informationen eingestellt werden.

7. "Add DEHN21 FAQ item" fügt neue Felder für eine FAQ hinzu.

4. Wähle als Hintergrundfarbe "DEHN red" und setze einen Haken bei "with centered content", sodass der Text zentriert dargestellt wird. 

5. Wähle thematisch passend zum Inhalt, ein SVG-Icon in Weiß aus der Mediendatenbank hinzu.

6. Füge eine kurze (!) Headline hinzu und wähle die "Headline Hierarchy" "H2" aus (sollte sie nicht bereits voreingestellt sein) und füge einen kurzen und prägnanten Text hinzu.

7. Wähle eine "URL" und den entsprechenden "Link text" aus – dieser sollte bestenfalls nicht mehr als zwei Wörter enthalten.

8. In den Karten wird ein roter Button eingesetzt, dazu wähle "Solid button" über die Checkbox aus und speichere die Karte ab.

Hinweis: Nutze bei internen Verlinkungen innerhalb der DEHN-Websites (URL) immer den entsprechenden Seiten-Titel, wenn dieser bekannt ist. Siehe dazu auch den Hinweis zu internen Verlinkungen.

4. Füge auf der Seite, auf welcher der Text erscheinen soll (links oder rechts), über "Add block" eine Headline hinzu. Diese hat die Größe "H3".

5. Füge einen Text über "Add block" hinzu.

6. Füge unterhalb des Textes einen "Link button / download button" hinzu. Und lade entweder ein Dokument hoch oder wähle eines aus der Mediendatenbank aus. Benenne den Button (Button text) und setze ein Häkchen bei "Solid button".

Hinweis: Achte darauf, dass der Text nicht zu lang ist und bestenfalls die gleiche Höhe wie das Bild auf der anderen Seite hat – andernfalls wird das Bild automatisch beschnitten.
Diese Komponente kann auf unterschiedliche Art und Weise variiert werden: Kombiniert ein Bild auf der linken Seite, mit einer Headline und einem beschreibenden Text auf der rechten Seite und umgekehrt. Ein Link kann ebenfalls eingestellt werden.