Vorher-Nachher-Block einrichten
Mit diesem Block zeigst du deinen Besuchern zwei Bilder oder Zustände nebeneinander – etwa ein Vorher-Nachher-Vergleich oder zwei Varianten eines Produkts. Der Besucher kann einen Schieberegler bewegen, um zwischen den beiden Ansichten zu wechseln.
Voraussetzungen
Es gibt keine besonderen Voraussetzungen.
So gehst du vor
Öffne den Block zur Bearbeitung. Du siehst zwei Bereiche: "Allgemein" und "Inhalt (Zettel + App)".
Wähle optional eine Farbvariante. Das Auswahlfeld "Farbvariante" bestimmt das Aussehen des Blocks – wenn du nichts wählst, wird die Standardfarbe verwendet.
Trage optional einen Eyebrow ein – das ist eine kurze Zeile über der Hauptüberschrift. Du kannst hier Markdown verwenden, um Text hervorzuheben oder zu verlinken.
Trage einen Titel ein – das ist die Hauptüberschrift des Blocks. Auch hier ist Markdown möglich.
Trage optional einen Untertitel ein – das ist eine erklärende Zeile unter dem Titel.
Beschrifte die beiden Seiten:
- Label links: Wie heißt der linke Zustand? (z. B. "Vorher")
- Label rechts: Wie heißt der rechte Zustand? (z. B. "Nachher")
Wechsle zum Bereich "Inhalt (Zettel + App)" – hier fügst du die beiden Bilder oder Inhalte ein. Die Bedienung richtet sich danach, wie dieser Bereich aufgebaut ist.
Speichere deine Änderungen.
Aufbau des Fensters
Das Bearbeitungsfenster ist in zwei Bereiche aufgeteilt:
Allgemein
- Farbvariante: Bestimmt das farbliche Aussehen des Blocks. Optional – wenn du nichts wählst, gilt die Standardfarbe.
- Eyebrow: Eine kurze Zeile über der Hauptüberschrift (optional). Markdown wird unterstützt.
- Titel (Markdown): Die Hauptüberschrift des Blocks. Hier kannst du Markdown verwenden.
- Untertitel: Eine erklärende Zeile unter dem Titel (optional). Auch hier ist Markdown möglich.
- Label links und Label rechts: Die Beschriftungen für die beiden Seiten des Vergleichs.
Inhalt (Zettel + App) Hier fügst du die beiden Inhalte (Bilder oder andere Elemente) ein, die der Besucher vergleichen kann.
Was danach passiert
Der Block wird mit deinen Einstellungen gespeichert. Deine Besucher sehen die Vorher-Nachher-Ansicht mit einem Schieberegler in der Mitte – sie können ihn hin und her bewegen, um beide Zustände zu vergleichen. Der Titel, der Untertitel und die Beschriftungen erscheinen oben.
Tipps und Hinweise
- Verwende sprechende Beschriftungen für die beiden Seiten, damit deine Besucher sofort verstehen, was sie vergleichen.
- Die Bilder sollten die gleiche Größe und Ausrichtung haben – das macht den Vergleich einfacher.
- Nutze Markdown in Titel und Untertitel, um besondere Wörter hervorzuheben oder zu verlinken.