Projekt Teaser

Über das Feld "+ Inhalt" und anschließend "Individueller Seiteninhalt" kann das Content-Element "Projekt Teaser" ausgewählt werden.

Zuerst kann die "Überschrift" eines Projekts gepflegt werden. Unter "Adresse" kann eine Adresse oder eine kurze Beschreibung des Projekts hinzugefügt werden. Anschließend kann über eine Dropdownliste eine "Hintergrundfarbe" ausgesucht werden. Unter "Bild" und "Bild hinzufügen" kann ein Bild aus der Dateiliste ausgewählt werden.

Zum Schluss können die Bild-Metatdaten bearbeitet werden. Unter "Titel" sollte ein kurzer Titel des Bildes eingefügt werden. Das Feld "Alternativer Text" sollte mit einem Satz gefüllt werden, der das Bild beschreibt. Hierbei sollten die starken Keywords aus der Keywordliste eingebaut werden, um die Seite in Bezug auf SEO zu optimieren. Unter "Bildbearbeitung" befindet sich das Feld "Editor öffnen". Damit lassen sich die Seitenverhältnisse des Bildes für Mobile, Tablet und Desktop anpassen. In diesem Fall wird jeweils ein Seitenverhältnis von 4:3 empfohlen.

Darstellung des Elements im Frontend

Hier wurde in einem 33% / 33% / 33% Grid je Spalte ein Projekt Teaser gepflegt (=3 Projekt Teaser nebeneinander).

(Darunter wurde ein weiteres 33% / 33% / 33% Grid mit 3 Projekt Teasern hinzugefügt.)

Ein einzelner Projekt Teaser zeigt das Bild, die Überschrift, den hellblauen Hintergrund und eine kurze Beschreibung des Projekts.