Was macht die Komponente?
Ein Teaser ist eine Vorschau, der Nutzende neugierig machen und sie dazu anregen soll, auf weitere Inhalte oder Seiten zu klicken.
Wann soll die Komponente eingesetzt werden?
- Um Inhalte, Artikel, Produkte oder Dienstleistungen hervorzuheben und zu bewerben.
- Um Nutzende auf weiterführende Informationen oder interessante Inhalte aufmerksam zu machen.
Regeln
- Verwende eine prägnante und einladende Überschrift sowie eine kurze, interessante Beschreibung.
- Verwende nicht zu viele verschiedene Teaser-Arten- und Grössen auf einer Seite.
- Mehrere Teaser können mit einem Titel strukturiert werden.
Verwandte Komponenten
| Nummer | Typ | Beschreibung | Optional | Hinweis |
|---|---|---|---|---|
| 1 | Komponente | sbb-image |
Nein | |
| 2 | Komponente | sbb-chip |
Ja |
Beispiele
The sbb-teaser-paid is a component with a background image and a chip with a text.
<sbb-teaser-paid>
<sbb-chip slot="chip">Label</sbb-chip>
<sbb-image slot="image" image-src="https://path-to-source" alt="SBB CFF FFS Employee"></sbb-image>
</sbb-teaser-paid>
Slots
The sbb-teaser-paid component has two slots: the image slot, used to slot an sbb-image and the chip slot, used to slot an sbb-chip.
Slots
| Name | Description |
|---|---|
chip |
Link content of the panel |
image |
The background image that can be a sbb-image |