Vergleich und Pitch gestalten

Du erstellst zwei unterschiedliche Bausteine für deine Website: einen Vergleichstisch, der zwei Varianten nebeneinander zeigt, und einen Pitch-Bereich mit Text, Chips, Bild und Schaltfläche. Beide Bausteine lassen sich farblich anpassen und enthalten jeweils eine Handlungsaufforderung.
Voraussetzungen
Du bearbeitest bereits einen Block auf einer Seite. Es gibt keine weiteren Voraussetzungen.
Aufbau des Fensters
Oben öffnet sich die Seitenleiste zur Konfiguration. Sie ist in mehrere Abschnitte unterteilt, die du nacheinander durchgehst: Allgemein für grundlegende Einstellungen, dann spezifische Bereiche für Überschriften, Inhalte und Designelemente, abschließend die Handlungsaufforderung. Jeder Abschnitt lässt sich auf- und zuklappen.
So gehst du vor
Vergleichstisch einrichten
Öffne den Abschnitt Allgemein und fülle diese Felder:
- Bezeichnung (für Verlinkung): Ein eindeutiger Name, unter dem du diesen Block später wiederfindest (optional, Beispiele sind im Quelltext nicht belegt)
- Farbvariante: Wähle eine Farbe aus dem Auswahlfeld oder lasse es leer
Klicke auf Überschrift, um den Abschnitt zu öffnen:
- Eyebrow: Ein kurzer Vortitel (optional, formatierbar mit Markdown)
- Titel (Markdown): Die Hauptüberschrift (formatierbar mit Markdown)
- Untertitel: Eine Erklärung unter dem Titel (optional, formatierbar mit Markdown)
- Linke Spalte (Ohne): Der Kopf der linken Tabellenspalte
- Rechte Spalte (Mit): Der Kopf der rechten Tabellenspalte
Öffne den Abschnitt Zeilen. Hier vergleichst du die beiden Varianten Punkt für Punkt:
- Klicke Zeile hinzufügen, um eine neue Vergleichszeile zu erstellen
- In jeder Zeile trage ein: Ohne (linke Spalte) und Mit (rechte Spalte)
- Mit den Pfeiltasten verschiebst du Zeilen auf oder ab; die Löschtaste entfernt eine Zeile
Klicke auf CTA, um die Handlungsaufforderung einzurichten:
- Text: Die Beschriftung der Schaltfläche
- Ziel: Die Adresse oder Seite, zu der die Schaltfläche führt (nutze den Link-Picker zur Auswahl)
Speichere deine Einstellungen mit der Schaltfläche Speichern oben rechts.
Pitch-Bereich einrichten
Öffne den Abschnitt Allgemein:
- Bezeichnung (für Verlinkung): Ein eindeutiger Name für diesen Block (optional)
- Reihenfolge umdrehen: Aktiviere diesen Schalter, wenn Bild und Text seitenverkehrt angeordnet sein sollen
- Farbvariante: Wähle eine Farbe oder lasse es leer
Klicke auf Text:
- Kleiner Titel: Ein Vortitel (optional, formatierbar mit Markdown)
- Überschrift: Die Hauptüberschrift (formatierbar mit Markdown)
- Text: Der Beschreibungstext (formatierbar mit Markdown, 4 Zeilen verfügbar)
Öffne Themen-Chips, um Stichpunkte oder Themen hervorzuheben:
- Klicke Eintrag hinzufügen, um einen neuen Chip zu erstellen
- Wähle ein Symbol aus der Symbolbibliothek und gib eine Bezeichnung ein
- Mit Pfeiltasten veränderst du die Reihenfolge; die Löschtaste entfernt einen Chip
Öffne Dashboard-Mock Inhalt (optional): Hier kannst du eine grafische Statistik oder Anzeige einbinden
Klicke auf Bild und schwebender Hinweis:
- Lade oder wähle ein Bild für den Bereich
- Optional: Füge einen schwebenden Hinweis hinzu mit Symbol, Titel und Untertitel
Öffne Schaltfläche:
- Text: Die Beschriftung der Schaltfläche
- Buttontyp: Wähle den Stil der Schaltfläche (z. B. Farbe, Größe)
- Navigationsziel: Die Adresse oder Seite, zu der die Schaltfläche führt (nutze den Link-Picker)
Speichere deine Einstellungen mit Speichern oben rechts.
Was danach passiert
Die Bausteine werden auf deiner Website angezeigt. Der Vergleichstisch stellt die beiden Varianten übersichtlich nebeneinander dar; der Pitch-Bereich zeigt Bilder, Texte und Chips in einer ansprechenden Anordnung. Beide laden Besucher über die Schaltflächen zum Handeln ein. Du kannst jederzeit zurückkehren und die Inhalte, Farben oder Links anpassen, indem du den Block erneut öffnest.
Tipps und Hinweise
- Die Markdown-Felder in Überschriften ermöglichen dir Fettdruck, Kursiv und Listen – nutze das zur Formatierung.
- Die Reihenfolge der Zeilen beim Vergleich und der Chips beim Pitch lässt sich jederzeit neu ordnen, ohne den Inhalt zu verlieren.
- Wenn du ein Navigationsziel per Link-Picker wählst, kannst du interne Seiten deiner Website oder externe Adressen verlinken.
- Ein leeres Farb-Auswahlfeld bedeutet, dass die Standardfarbe verwendet wird.