Teaser

Teaser dienen dazu, auf andere Inhalte der Seite zu verlinken. Welche Möglichkeiten die Hobby-Website bietet, wird auf dieser Seite dargestellt. Auf dieser Seite kommt außerdem eine weitere Option zum Einsatz, längere Seiten zu unterteilen und so quasi als Teaser innerhalb der Seite zu fungieren: Die Sticky Navigation. Dazu werden Seiteninhalte in Grid-Elementen "Raster für Section" zusammengefasst und über das Content Element "Sticky Navigation" verlinkt. Wichtig dabei: nicht zu viele Sections innerhalb einer Seite und möglichst kurze Section-Bezeichnungen.

Nun aber zu den klassischen Arten der Teaser:

Basic Teaser

Sollen andere Seitenbereiche verlinkt werden, können "Basic Teaser" verwendet werden. Man kann diese einzeln setzen:

Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Außerdem kann ein Bild eingebunden werden.

Kataloge Freisteller klein

Die Teaser können auch in ein "Raster Zweispaltig" platziert werden. Natürlich kann auch das Theme oder die Hintergrundfarbe geändert werden. Immer auf die richtigen Abstände in den Raster-Elementen achten!

Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Außerdem kann ein Bild eingebunden werden.

Kataloge Freisteller klein

Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Außerdem kann ein Bild eingebunden werden.

Kataloge Freisteller klein

Bei Bedarf können die Teaser auch in ein "Raster Dreispaltig" integriert werden. Dabei ist aber darauf zu achten, dass die Headlines nicht zu lang werden, bzw mit einem "­" Trennvorschläge gemacht werden. In den Rastereinstellungen muss "Kein Abstand" bei "Abstand an den Seiten" eingestellt sein.

Klim Strand Camping

Hier steht die Headline

Der Teaser Style kann auch von "Überschrift oben" auf "Bild oben" gewechselt werden.

Klim Strand Camping

Hier steht die Headline

Der Teaser Style kann auch von "Überschrift oben" auf "Bild oben" gewechselt werden.

Klim Strand Camping

Hier steht die Headline

Der Teaser Style kann auch von "Überschrift oben" auf "Bild oben" gewechselt werden.

Full Image Teaser

"Full Image Teaser" können zu gleichen Zwecken wie Basic Teaser eingesetzt werden. Jedoch sollten in zwei- oder dreispaltigen Rastern immer Teaser einer Art stehen. Allein im "Raster für die Startseiten-Teaser" oder im "Raster für Teaser mit Marginalspalte" können die Teaserarten variieren. Bei nebeneinander stehenden Full Image Teasern ist zu beachten, dass die Bilder gleich groß sind und der platzierte Teasertext genügend Fläche hat. In den Rastereinstellungen muss "Kein Abstand" bei "Abstand an den Seiten" eingestellt sein.

Vorschau, Vorschau, Vorschau! In allen Browsergrößen!

Headline Teaser

Headline Teaser sind (zunächst) rein typografische Teaser, die ausschließlich auf textlastige Offcanvas-Inhalte verlinken sollen. Durch die Darstellung weiß der User gleich, dass sich etwas offcanvas öffnet. Das Element "Headline Teaser" wird ohne Raster eingepflegt. In einem Headline Teaser können mehrere offcanvas-Inhalte angeteasert werden.

Offcanvas-Inhalt

Offcanvas-Inhalte werden in das "Raster für Offcanvas-Inhalte" eingepflegt. Dort sind nur die Standard-Elemente wie Text, Text und Bilder und Bilder möglich. Ein zusätzliches Raster für Artikel ist nicht notwendig. Inhalte im "Raster für Offcanvas-Inhalte" sind auf der Seite nicht sichtbar, sondern müssen über Teaser zugänglich gemacht werden.

Redaktionelle Teaser

Einige Inhalte der Hobby-Seite sind eher redaktioneller Art, z.B. die Reisetipps, Mein Hobby und ich und Stellplatztipps. Diese Artikel haben meistens eine Headline, die durch eine Versalheadline schwer lesbar wird. Um diese Inhalte anzuteasern, gibt es zwei weitere Formen von Teasern: Der "Square Image Teaser" und der "Wide Image Teaser". Bei Reise- und Stellplatztipps werden diese über die Extension generiert, für andere Inhalte (z.B. Mein Hobby und ich, News etc.) können sie über ein FCE selbst erstellt werden.

Natürlich können auch hier wieder Theme und Hintergrundfarbe eingestellt werden.

Square Image Teaser

Der Square Image Teaser muss in ein "Raster mit voller Breite" eingepflegt werden. Dort muss die Breite limitiert werden.

Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Zusätzlich kann ein Bild, das 640x640px misst, eingebunden werden. Auch hier muss der richtige Ausschnitt getestet werden.

Wide Image Teaser

Der Wide Image Teaser ist bevorzugt in ein dreispaltiges Raster einzupflegen. In den Rastereinstellungen muss "Kein Abstand" bei "Abstand an den Seiten" eingestellt sein.

Abenteuer Albanien
Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Zusätzlich kann ein Bild, das 640x310px misst, eingebunden werden.

Abenteuer Albanien
Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Zusätzlich kann ein Bild, das 640x310px misst, eingebunden werden.

Abenteuer Albanien
Hier kann eine Preline stehen

Hier steht die Headline des Teasers

Und hier steht der Teasertext. Zusätzlich kann ein Bild, das 640x310px misst, eingebunden werden.

Dealer Teaser

Soll der Dealer-Finder angeteasert werden, muss der "Dealer Teaser" eingebunden werden. Dort können auch Deeplinks auf die Produktkategorien gesetzt werden.

Styles

Hier werden die verschiedenen Styles und Themes aufgezeigt.

Raster

In diesem Kapitel werden alle verfügbaren Rasterelemente vorgestellt.

Seiten­ele­mente

Hier werden die verschiedenen Elemente zur Gestaltung von Seiten erklärt.