• Zweck: Die einfachste Möglichkeit, eine Textzeichenkette hinzuzufügen. Sie können wählen, ob der Text als Absatz oder als Überschrift dargestellt werden soll, um eine klare typografische Hierarchie zu schaffen.

• Konfigurierbare Eigenschaften: Content (Text), Text type (Dropdown).

• Anwendungsbeispiel: Diese Komponente ist die Grundlage für alle textbasierten Inhalte, von Produktbeschreibungen bis hin zu Überschriften.

Beispiele

• Zweck: Ein einfacher, anklickbarer Link, der Benutzer zu anderen Seiten oder externen Websites leitet.

• Konfigurierbare Eigenschaften: URL (Text), Open in a new tab (yes/no), Content (Text/Image).

• Anwendungsbeispiel: Kann als eigenständiger Link oder eingebettet in andere Komponenten verwendet werden.

• Zweck: Ein eigenständiges Bild anzeigen. Diese Komponente ist auf Performance ausgelegt und unterstützt responsive Bilder und verschiedene Seitenverhältnisse von Haus aus.

• Konfigurierbare Eigenschaften: Image Desktop (Asset), Image Mobile (Asset), Alt Text (Text), Aspect Ratio Desktop / Aspect Ratio Mobile (Dropdown).

• Anwendungsbeispiel: Verwendung für Produktfotos, Banner oder redaktionelle Inhalte.

• Zweck: Ein Video einbetten. Diese Komponente handhabt automatisch die Wiedergabe und responsive Vorschau-Bilder (Preview Images) für eine reibungslose Benutzererfahrung.

• Konfigurierbare Eigenschaften: Video (Asset), Preview Image Desktop / Preview Image Mobile (Asset), Aspect Ratio, Autoplay, Muted, Loop, Show Controls (toggles).

• Anwendungsbeispiel: Produkte in Aktion zeigen oder ein Hero-Video auf einer Landingpage hinzufügen.

• Zweck: Ein vielseitiger Container zum Gruppieren anderer Komponenten. Es ist die primäre Methode zur Definition unterschiedlicher, vollflächiger Inhaltszeilen mit einzigartigem Styling.

• Konfigurierbare Eigenschaften: Background Color (Hex-Code), Background Image Desktop / Background Image Mobile (Asset), Padding (Dropdown), Content (Referenzfeld für verschachtelte Komponenten).

• Anwendungsbeispiel: Verwenden Sie es, um eine neue Zeile für ein Aktionsbanner oder einen Hero-Bereich mit spezifischem Hintergrund zu erstellen.

• Zweck: Komponenten in einem responsiven, mehrspaltigen Layout anordnen. Dies ermöglicht die Erstellung strukturierter Inhaltsbereiche wie einer Produktgalerie oder einer Reihe von Teasern.

• Konfigurierbare Eigenschaften: Number of columns for desktop (bis zu 6) / Number of columns for mobile (bis zu 3), Gap size between columns on desktop / Gap size between columns on mobile (Dropdown), Gap size between rows on desktop / Gap size between rows on mobile (Dropdown), Column content (Referenzfeld für verschachtelte Komponenten).

• Anwendungsbeispiel: Verwenden Sie ein 3-spaltiges Raster, um drei Teaser-Karten nebeneinander auf einem Desktop anzuzeigen.

• Zweck: Die vertikale Distanz zwischen Komponenten steuern. Es kann auch verwendet werden, um eine einfache visuelle Trennlinie hinzuzufügen.

• Konfigurierbare Eigenschaften: Height (Dropdown), Show Line (Toggle).

• Anwendungsbeispiel: Fügen Sie einen Abstandshalter zwischen einem Hero-Banner und einem Produktraster ein, um die visuelle Hierarchie zu verbessern.

• Zweck: Ein leistungsstarker Texteditor, der eine breite Palette von Formatierungen unterstützt, von einfachen Fettungen und Listen bis hin zum Einbetten von Bildern und Links innerhalb des Textes selbst.

• Konfigurierbare Eigenschaften: Content (Rich Text Editor Feld).

• Anwendungsbeispiel:

  • Fett

  • Kursiv

  • Unterstrichen

  • Link

  • Ungeordnete Liste

    • Punkt

    • Punkt

    • Punkt

  • Geordnete Liste

    1. Punkt

    2. Punkt

       1. Punkt

• Zweck: Ein vielseitiges Karussell, das jede andere Inhaltskomponente als Slides enthalten kann. Sie können es verwenden, um Karussells mit Bildern, Promotionen oder Teasern zu erstellen.

• Konfigurierbare Eigenschaften: Content (Referenzfeld), Show Navigation Arrows (Toggle), Show Pagination Indicators (Toggle).

• Anwendungsbeispiel: Erstellen Sie ein vollflächiges Bilderkarussell auf der Startseite mit benutzerdefinierten Bannern.

• Zweck: Ein eigenständiger, anklickbarer Button, der Benutzer zu einer bestimmten Aktion oder Seite führt.

• Konfigurierbare Eigenschaften: Text (Text), Style (Dropdown), URL (Text), OpenInNewTab (Toggle).

• Anwendungsbeispiel: Ein "Jetzt Shoppen"-Button auf einem Aktionsbanner.

• Zweck: Organisiert Inhalte in erweiterbaren/einklappbaren Abschnitten, ideal für FAQs, Produktdetails oder immer dann, wenn vertikaler Platz gespart werden soll.

• Konfigurierbare Eigenschaften: Das Akkordeon hat einen Titel (Text) und ein Array von Akkordeon-Element-Referenzen. Das Akkordeon-Element hat einen Titel (Text) und verschachtelten Inhalt (Referenzfeld für andere Komponenten).

• Anwendungsbeispiel: Ein FAQ-Bereich auf einer Produktseite, um die Seite übersichtlich zu halten.