weboffice.digital - Dokumentation
Branche Beauty Branche Gastro Branche Handel
PDF

Vergleich und Pitch einrichten

Vergleich und Pitch einrichten

Mit den Blöcken "Vergleichstabelle" und "Split Pitch" zeigst du auf deiner Website Unterschiede zwischen zwei Varianten – etwa "ohne" und "mit" einer Lösung – oder präsentierst ein Angebot überzeugend mit Text, Bild und Schaltfläche nebeneinander.

Voraussetzungen

Du bearbeitest gerade einen Block auf einer Seite. Dies funktioniert nur mit den entsprechenden Rollen.

So gehst du vor

Vergleichstabelle einrichten

  1. Öffne den Abschnitt Allgemein. Trage eine Bezeichnung (für Verlinkung) ein – damit kannst du später auf diesen Block verlinken, wenn nötig.
  2. Wähle eine Farbvariante aus dem Auswahlfeld, um das Aussehen der Tabelle zu bestimmen.
  3. Öffne den Abschnitt Überschrift und gestalte den oberen Teil der Tabelle:
    • Eyebrow: ein kurzer Hinweis vor der Hauptüberschrift
    • Titel (Markdown): die Hauptüberschrift der Tabelle – hier kannst du Fettdruck und andere Formatierung verwenden
    • Untertitel: ein erläuternder Text unter der Überschrift
    • Linke Spalte (Ohne): der Kopf der linken Spalte
    • Rechte Spalte (Mit): der Kopf der rechten Spalte
  4. Öffne den Abschnitt Zeilen. Klicke auf Zeile hinzufügen, um eine neue Vergleichszeile zu erstellen.
  5. Trage in der neuen Zeile in beide Spalten deine Inhalte ein:
    • Ohne: Eintrag für die linke Spalte
    • Mit: Eintrag für die rechte Spalte
  6. Wiederhole Schritt 4 und 5 für alle weiteren Vergleichspunkte. Jede Zeile kannst du mit den Pfeilen nach oben oder unten verschieben oder über den Papierkorb löschen.
  7. Öffne den Abschnitt CTA. Trage einen Text für die Schaltfläche ein.
  8. Klicke auf das Feld Ziel und wähle die Seite oder den Link aus, auf den die Schaltfläche verweisen soll.

Split Pitch einrichten

  1. Öffne den Abschnitt Allgemein. Trage eine Bezeichnung (für Verlinkung) ein.
  2. Aktiviere das Kontrollkästchen Reihenfolge umdrehen, wenn Text und Bild seitlich getauscht werden sollen.
  3. Wähle eine Farbvariante aus.
  4. Öffne den Abschnitt Text und fülle die Überschrift und Beschreibung:
    • Kleiner Titel: ein Eyebrow vor der Hauptüberschrift
    • Überschrift: die Hauptüberschrift
    • Text: der längere Beschreibungstext – hier kannst du mehrere Zeilen und Formatierung verwenden
  5. Öffne den Abschnitt Themen-Chips. Klicke auf Eintrag hinzufügen, um ein Thema-Chip hinzuzufügen.
  6. Wähle für jedes Chip ein Icon (Symbol) und trage eine Bezeichnung ein.
  7. Verschiebe die Chips bei Bedarf mit den Pfeilen oder lösche sie über den Papierkorb.
  8. Öffne den Abschnitt Dashboard-Mock Inhalt und gestalte dort ein Anzeigebeispiel – etwa Kennzahlen oder Grafiken, die dein Angebot visualisieren.
  9. Öffne den Abschnitt Bild und schwebender Hinweis:
    • Wähle ein Bild über die Bildauswahl. Du kannst dort auch festlegen, wie das Bild angepasst wird.
    • Wähle optional ein Icon für einen schwebenden Hinweis neben dem Bild.
    • Trage einen Titel und Untertitel für diesen Hinweis ein.
  10. Öffne den Abschnitt Schaltfläche. Trage einen Text für die Schaltfläche ein.
  11. Wähle einen Buttonstil aus dem Auswahlfeld (z. B. Primär oder Sekundär).
  12. Klicke auf das Feld Navigationsziel und wähle die Seite oder den Link aus, auf den die Schaltfläche verweisen soll.

Aufbau der Blöcke

Vergleichstabelle

Die Vergleichstabelle besteht aus einer Kopfzeile, Vergleichszeilen und einer Schaltfläche am unteren Ende.

Kopfbereich:

  • Eyebrow: optional, kurzer Hinweis
  • Titel: die Hauptüberschrift
  • Untertitel: Erklärtext unter der Überschrift
  • Spaltenköpfe: "Ohne" und "Mit" (oder deine Bezeichnungen)

Vergleichszeilen: Jede Zeile hat zwei Spalten. Du entscheidest, wie viele Zeilen du brauchst – jede kann mit den Pfeilen sortiert oder über den Papierkorb gelöscht werden.

Schaltfläche: Die CTA-Schaltfläche führt zu einem von dir gewählten Link oder einer Seite.

Split Pitch

Der Split Pitch kombiniert mehrere Elemente nebeneinander (oder übereinander, wenn du die Reihenfolge umdrehst).

Textbereich:

  • Eyebrow: kurzer Hinweis
  • Überschrift: Haupttitel
  • Text: ausführliche Beschreibung

Themen-Chips: Kleine Kästen mit Icon und Text, die wichtige Punkte hervorheben.

Dashboard-Mock: Ein Anzeigebeispiel – hier zeigst du, wie ein Ergebnis aussieht.

Bild mit schwebenden Hinweis: Das Hauptbild kann ein schwebendes Element haben – ein Icon mit Titel und Untertitel, das den Fokus auf etwas Wichtiges lenkt.

Schaltfläche: Mit Text, Stil und Navigationsziel – sie wird unten neben dem Text platziert.

Was danach passiert

Sobald du alle Einstellungen vorgenommen hast, werden die Blöcke auf deiner Website angezeigt. Der Vergleich erscheint als tabellarische Gegenüberstellung, der Split Pitch als Kombination von Text, Themen-Chips, Bild und Schaltfläche nebeneinander.

Alle Änderungen werden laufend gespeichert. Du kannst die Blöcke jederzeit erneut öffnen und bearbeiten.

Um weitere Blöcke auf der gleichen Seite zu nutzen, schau dir an, wie du einen Block auf einer Seite einrichtest.

Tipps und Hinweise

  • Bei der Vergleichstabelle wirkt der Kontrast zwischen "Ohne" und "Mit" am stärksten, wenn die linke Spalte skeptisch wirkt (z. B. mit Häkchen und Kreuzen) und die rechte Spalte positive Merkmale hervorhebt.
  • Themen-Chips im Split Pitch sollten die wichtigsten Vorteile in je ein oder zwei Worten zusammenfassen – zu viel Text wirkt überladen.
  • Das schwebendem Icon und der Hinweis neben dem Bild eignen sich hervorragend für Tipps oder Highlights: wähle ein Icon, das sofort zur Aussage passt.
  • Nutze Markdown in Überschriften und Textfeldern, um Wörter hervorzuheben – das macht deine Botschaft deutlicher.

Suche