Erscheinungsbild
Journal, Zeitstrahl & Stimmen
Drei redaktionelle Elemente für Erlebniswelten: ein Karten-Raster für Blog-/Journal-Beiträge, ein horizontal scrollbarer Zeitstrahl für Meilensteine und ein Zitat-Raster für Kund:innen-Stimmen.
Suchmaschinen und Screenreader für blinde und sehbehinderte Besucher orientieren sich an der Reihenfolge der Überschriften auf einer Seite, nicht an ihrer optischen Größe. Deshalb lässt sich bei manchen Elementen die Überschriften-Ebene gezielt einstellen.
Journal-Raster
Zeigt Artikel-Vorschauen als Karten-Raster — z. B. für einen Blog-Teaser oder redaktionelle Themen-Seiten.
Element einfügen
- In der Erlebniswelt eine Section anlegen und den Block „Boutique Journal-Raster" hinzufügen.
- Im Block sitzt bereits das Element „Boutique Journal-Raster" — rechts öffnet sich seine Konfiguration.
Einstellungen
| Feld | Wirkung |
|---|---|
| Spalten | Desktop-Raster mit 2 / 3 / 4 Spalten. Mobil immer volle Breite. |
| Bereichskopf anzeigen | Optionaler Kopf über dem Raster mit Überzeile, Überschrift, Linktext und Link-URL (geteilte Ausrichtung — Text links, Link rechts). |
| Überschriften-Ebene | Legt fest, als welche Überschrift der Text im Seitenaufbau zählt (h1 bis h3). Die Schriftgröße ändert sich dadurch nicht. Faustregel: pro Seite genau eine h1 — auf Produktseiten ist das der Produktname, auf allen anderen die wichtigste Überschrift der Seite. |
| Ebene der Untertitel | Legt fest, als welche Überschrift die Artikel-Headline der einzelnen Karten im Seitenaufbau zählt (h2 bis h4). Sie sollte eine Stufe unter der Bereichskopf-Überschrift liegen. |
| Artikel | Beliebig viele Artikel-Karten (mind. 1). Über die Tab-Leiste per „+" hinzufügen, per „Eintrag entfernen" löschen. Je Artikel: Artikel-Titelbild, Bild-Alt-Text, Kategorie, Lesezeit, Artikel-Headline, Artikel-Auszug und optional Link-Beschriftung + Link-URL. |
Was im Frontend passiert
- Artikel mit Link-URL werden als komplette klickbare Karte gerendert, Artikel ohne Link-URL bleiben nicht klickbar.
- Fehlt die Link-Beschriftung, erscheint automatisch der Text „Lesen".
- Kategorie und Lesezeit werden, wenn beide gesetzt sind, durch einen Mittelpunkt („·") getrennt angezeigt.
- Das Titelbild wird responsive und lazy-loaded ausgegeben.
Zeitstrahl
Horizontal scrollbare Reihe von Meilensteinen — z. B. Marken- oder Unternehmensgeschichte.
Element einfügen
- Block „Boutique Zeitstrahl" in der Erlebniswelt hinzufügen.
- Das Element „Boutique Zeitstrahl" sitzt bereits im Block.
Einstellungen
| Feld | Wirkung |
|---|---|
| Label | Kleine Zeile über der Headline. |
| Headline | Überschrift des Zeitstrahls. |
| Überschriften-Ebene | Legt fest, als welche Überschrift der Text im Seitenaufbau zählt (h1 bis h3). Die Schriftgröße ändert sich dadurch nicht. Faustregel: pro Seite genau eine h1 — auf Produktseiten ist das der Produktname, auf allen anderen die wichtigste Überschrift der Seite. |
| Ebene der Untertitel | Legt fest, als welche Überschrift der „Titel" der einzelnen Einträge im Seitenaufbau zählt (h2 bis h4). Er sollte eine Stufe unter der Headline des Zeitstrahls liegen. |
| Einleitungstext | Kurzer Fließtext unter der Headline. |
| Einträge | Bis zu 12 Karten. Je Eintrag: Bild, Jahr oder Kennung, Titel, Text. Hinzufügen/Entfernen über die Tab-Leiste. |
Was im Frontend passiert
- Die Karten laufen in einer horizontal scrollbaren Leiste; Pfeil-Buttons und Punkt-Navigation unter dem Zeitstrahl erlauben gezieltes Weiterklicken.
- „Jahr oder Kennung" wird als Overlay-Anzeige auf dem Bild eingeblendet.
- Ohne Einträge bleibt die Section leer (kein Platzhaltertext im Frontend).
Stimmen
Zitat-Raster für Kund:innen-Stimmen/Testimonials.
Element einfügen
- Block „Boutique Stimmen" in der Erlebniswelt hinzufügen.
- Das Element „Boutique Stimmen" sitzt bereits im Block.
Einstellungen
| Feld | Wirkung |
|---|---|
| Bereichskopf anzeigen | Optionaler Kopf mit Überzeile, Überschrift, Linktext und Link-URL (geteilte Ausrichtung). |
| Überschriften-Ebene | Legt fest, als welche Überschrift der Text im Seitenaufbau zählt (h1 bis h3). Die Schriftgröße ändert sich dadurch nicht. Faustregel: pro Seite genau eine h1 — auf Produktseiten ist das der Produktname, auf allen anderen die wichtigste Überschrift der Seite. |
| Spalten | 1 / 2 / 3 Spalten Desktop-Raster. |
| Anführungszeichen | German „" / English " " / None (kein Anführungszeichen-Zeichen vor dem Zitat). |
| Stimmen | Bis zu 9 Zitate. Je Stimme: Zitat, Person (Name, Ort), optionale Kontextzeile (z. B. „Käuferin seit 2024") und optionales Avatar-Bild. |
Was im Frontend passiert
- Jedes Zitat erscheint als Karte mit optionalem Anführungszeichen-Zeichen, Zitattext, Avatar (falls hinterlegt) sowie Name und Kontextzeile.
- Ohne Zitate bleibt die Section leer.