Erstellung des Inhaltselements "Teaser mit Bild"

Bei dem Inhaltselement "Teaser mit Bild" handelt es sich um einen Seiteninhalt, welches im Reiter "Medien" zu finden ist.

Dieses Element wird genutzt, um andere Inhalte und Seiten anzuteasern. Bei diesem Teaser muss ein Bild eingefügt werden und es können maximal 3 Teaser in einem Element erstellt werden. 

Dem Element kann eine übergeordnete Überschrift gegeben werden. Um die Hierarchie der Überschriften zu gewährleisten, kann der Typ der Überschrift angegeben werden. Hier kann zwischen H1 - H5 und verborgen gewählt werden. Verborgene Überschriften werden im Frontend und im HTML-Code der Seite nicht ausgeben. Bei "Standard" wird eine H2 ausgegeben. Diese ist immer vorausgewählt.

Es kann ausgewählt werden, ob die Teaser einspaltig untereinander oder aber dreispaltig nebeneinander dargestellt werden sollen. Wenn eine dreispaltige Anordnung ausgewählt wurde, erscheint ein Toggle. Mit diesem kann gesteuert werden, wie die Verlinkung der Teaser aussehen soll. Normalerweise wird der gesamte Teasertext unter der Überschrift des Teasers verlinkt. Soll aber ein Linktext unter dem Teasertext erscheinen, dann muss dieser Toggle aktiviert werden. Diese Einstellung gilt für alle 3 Teaser in diesem Element.

Über den Button „Neu anlegen“ kann ein Teaser Element angelegt werden. Hier können maximal 3 Elemente angelegt werden. Ist die maximale Anzahl erreicht, verschwindet der Button.

Sowohl das Bild, als auch die Überschrift sind Pflichtfelder und müssen ausgefüllt werden.

Wenn Publikationen und Handreichungen angeteasert werden sollen, kann der Toggle “” aktiviert werden. Dadurch wird neben der kleinen Überschrift über der Hauptüberschrift das Icon des Buches angezeigt. 

Der Teasertext (Bodytext) hat eine Zeichenbegrenzung von 270 Zeichen. Danach wird der Text abgeschnitten. Hier muss darauf geachtet werden, dass die Zeichenanzahl eingehalten wird.
Um hier einen erzwungenen Zeilenumbruch zu generieren, kann einfach der Text mit der ENTER-Taste getrennt werden. Auf der Webseite wird an dieser Stelle automatisch ein HTML-Tag für den Zeilenumbruch generiert. Dieser erzwungene Zeilenumbruch wird auf allen Endgeräten (egal welche Größe) angezeigt.

Wenn der Toggle „Link unter Teasertext“ aktiviert wurde, dann wird bei dreispaltigen Teasern der Link unter dem Teasertext angezeigt. Normal wird bei dreispaltigen Teasern der Teasertext verlinkt. Bei einspaltigen Teasern wird der Link unter dem Teasertext platziert.
Im Feld „Linktext“ kann ein kurzer Linktext eingetragen. Bleibt das Feld leer, wird automatisch „mehr erfahren“ als Linktext auf der Seite angezeigt.
Soll als Linktext „mehr erfahren“ stehen bleiben, ist es gut, wenn im Feld „Titel“ im Link Browser ein aussagekräftiger Titel für den Link angegeben wird. Der Titel soll das Linkziel benennen. Dies dient der Verbesserung der Barrierefreiheit.

Der Überschrift kann auch hier wieder ein Typ zugewiesen werden. Hier stehen die Typen Standard (H2), H2, H3 und H4 zur Verfügung.

In der Überschrift soll es die Möglichkeit geben, einen erzwungenen Zeilenumbruch und einen bedingten Trennstrich einzufügen.

Bedingter Trennstrich:
Der bedingte Trennstrich dient dazu, Wörter an einer bestimmten Stelle zu trennen, wenn der Platz in dem Teaser nicht mehr ausreicht. Es gibt keine automatische Silbentrennung in den Überschriften. Das bedeutet, dass Wörter nicht getrennt werden, sondern auf komplett auf eine neue Zeile rutschen, wenn der Platz im Teaser nicht ausreicht. Dies kann mit einem bedingten Trennstrich entgegengewirkt werden.
Für einen bedingten Trennstrich bitte ein ­ an die gewünschte Stelle im Wort platzieren. Dies führt dazu, dass das Wort an dieser Stelle getrennt wird, wenn der Platz in der Teaserbox nicht ausreicht.

Erzwungener/manueller Trennstrich
Um einen erzwungenen Zeilenumbruch zu generieren, muss bitte ein <br> an die gewünschte Stelle platziert werden. Dieser erzwungene Zeilenumbruch wird auf allen Endgeräten (egal welche Größe) angezeigt.

Es kann maximal nur ein Bild in das Element geladen werden.

Das Bild sollte einen Alternativtext besitzen. Dieser kann hier im Feld alternativer Text neu vergeben werden. Hat das Bild schon einen Alternativtext, wird dieser im Feld angezeigt. Er kann aber für das Bild in diesen Teaser überschrieben werden. 

Das Bild sollte hier keinen Beschreibungstext, Verlinkung und Titel bekommen. Der Beschreibungstext und die Verlinkung werden nicht angezeigt.

Die Bilder werden im Seitenverhältnis 3:2 oder 2:3 zugeschnitten. Hier ist es wichtig, dass im Editor noch einmal der Bildausschnitt kontrolliert wird.

Bilder im Hochformat dürfen nur in einspaltigen Teasern verwendet werden.