ShopBuilder Content-Widgets

Mit diesem Plugin fügst du 20 zusätzliche Widgets zu ShopBuilder hinzu.

1. Plugin-Installation

Plugin installieren:

  1. Öffne das Menü Plugins » Plugin-Set-Übersicht.

  2. Öffne das Plugin-Set, das du bearbeiten möchtest, indem du auf die Zeile in der Tabelle klickst.
    → Das Plugin-Set wird geöffnet.

  3. Klicke auf Plugin hinzufügen.

  4. Wähle das Plugin ShopBuilder Content-Widgets aus der Liste.
    → Es werden Informationen zu ShopBuilder Content-Widgets angezeigt.

  5. Wähle aus der Dropdown-Liste Version auswählen die Version des Plugins, die du installieren möchtest. Standardmäßig ist die neuste Version vorausgewählt.

  6. Um das Plugin zu installieren, klicke auf Installieren.
    → Das Plugin wird installiert.
    → Nachdem die Installation abgeschlossen ist, wird das Plugin-Set angezeigt.
    → Jetzt kannst du das Plugin konfigurieren. Gehe dazu wie unten beschrieben vor.

  7. Öffne das Menü Prioritäten festlegen.

  8. Setze die Priorität von ShopBuilder Content-Widgets auf 95. Diese Angabe ist nur dann gültig, wenn für die Plugins Ceres und IO die Standard-Prioritäten 90 bzw. 99 gesetzt sind. Wenn du die Prioritäten von Ceres und IO angepasst hast, wähle für ShopBuilder Content Widgets einen Wert, der zwischen den Werten von Ceres und IO liegt..

  9. Speichere die Prioritäten.

  10. Ändere den Zustand des Plugins zu aktiv ().

  11. Stelle (cloud_upload) das Plugin-Set bereit.
    → Wenn es beim bereit Stellen ein Problem gibt, klicke auf Details öffnen, um weitere Informationen zu erhalten.

1.1. Plugin-Konfiguration

Damit du alle Funktionen dieses Plugins nutzen kannst, musst du einige Container-Verknüpfungen einrichten.

Container-Verknüpfungen einrichten:

  1. Öffne das Menü Plugins » Plugin-Set-Übersicht.

  2. Öffne das Plugin-Set, in dem sich das Plugin ShopBuilder Content-Widgets befindet, indem du auf die entsprechende Zeile in der Tabelle klickst.

  3. Klicke auf die Zeile ShopBuilder Content-Widgets.

  4. Öffne das Menü Container-Verknüpfungen.

  5. Wähle all Optionen in dem Bereich Standard-Container-Verknüpfungen aus.

  6. Speichere () die Einstellungen.

2. Header-Widgets

Die folgenden Widgets sind nur im Header-Bereich der Seite verfügbar und können nicht in anderen Bereichen verwendet werden. Du kannst allerdings die meisten anderen Widgets auch im Header-Bereich verwenden, selbst wenn diese nicht innerhalb dieser Kategorie aufgeführt sind.

2.1. Benutzerdefinierte Link-Navigation

Mit diesem Widget fügst du eine Link-Navigation auf deiner Seite ein, die du auf deine Bedürfnisse anpassen kannst. Du kannst Links zu Kategorien, Varianten, Dateien und externen Seiten hinzufügen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

3. Struktur-Widgets

Struktur-Widgets sind dazu da, das Layout deiner Seite zu strukturieren. Sie haben keinen eigenen Inhalt, sondern werden mit anderen Widgets befüllt. Struktur-Widgets können auch mit anderen Struktur-Widgets befüllt werden, um eine Vielzahl an unterschiedlichen Layout-Optionen zu ermöglichen.

3.1. Spaltenwidget

Mit diesem Widget hast du die Möglichkeit, deine Inhalte in mehreren Spalten zu strukturieren. Du kannst den Spalten andere Widgets via Drag-and-drop hinzufügen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 2. Einstellungen Spaltenwidget
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Erscheinungsbild

Bestimmt die Farbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Anordnung des Spalteninhalts

Bestimmt die Startposition des Spalteninhalts. Folgende Optionen stehen zu Verfügung:

  • Nebeneinander: Der Inhalt beginnt auf der linken Seite der Spalte.

  • Nebeneinander; Umgekehrt: Der Inhalt beginnt auf der rechten Seite der Spalte.

  • Untereinander: Der Inhalt beginnt am oberen Ende der Spalte.

  • Untereinander; Umgekehrt: Der Inhalt beginnst am unteren Ende der Spalte.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4. Text

In dieser Widget-Kategorie werden alle Widgets aufgelistet, die für die Verarbeitung von Text zur Verfügung stehen.

4.1. Artikelseite Zitat

Mit diesem Widget hast du die Möglichkeit, deiner Seite eine Kombination aus einem Text und einem Bild hinzuzufügen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 3. Einstellungen Artikelseite Zitat
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.2. Karten 4-8

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. In dem anderen Bereich hast du die Möglichkeit, weitere Widgets zu platzieren. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 4. Einstellungen Karten 4-8
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.3. Karten 7-5

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. In einem Bereich hast du die Möglichkeit, weitere Widgets zu platzieren. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 5. Einstellungen Karten 7-5
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.4. Bild und Text 4-8

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild oder ein Video. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

.Einstellungen Bild und Text 4-8

Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Mediumsauswahl

Bestimmt den Typ des Elements. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Video

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Video-URL

Enthält die URL des Youtube-Videos.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.5. Bild und Text 5-7

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild oder ein Video. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

.Einstellungen Bild und Text 5-7

Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Mediumsauswahl

Bestimmt den Typ des Elements. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Video

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Video-URL

Enthält die URL des Youtube-Videos.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.6. Bild und Text 6-6

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild, eine Animation oder ein Video. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

.Einstellungen Bild und Text 6-6

Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Mediumsauswahl

Bestimmt den Typ des Elements. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Video

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Video-URL

Enthält die URL des Youtube-Videos.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.7. Hintergrundüberlappung 5-7

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild oder ein Video. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

.Einstellungen Hintergrundüberlappung 5-7

Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Mediumsauswahl

Bestimmt den Typ des Elements. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Lottie Animation

  • Video

Bei Lottie handelt es sich um ein Dateiformat für Animationen. Weitere Informationen findest du im Handbuch von Lottie.

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Lottie.js-JSON-Animationsdatei

Bietet die Möglichkeit, eine Animation aus dem Webspace zu wählen.

Video-URL

Enthält die URL des Youtube-Videos.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.8. Hintergrundüberlappung 6-6

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild oder ein Video. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

.Einstellungen Hintergrundüberlappung 6-6

Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Mediumsauswahl

Bestimmt den Typ des Elements. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Lottie Animation

  • Video

Bei Lottie handelt es sich um ein Dateiformat für Animationen. Weitere Informationen findest du im Handbuch von Lottie.

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Lottie.js-JSON-Animationsdatei

Bietet die Möglichkeit, eine Animation aus dem Webspace zu wählen.

Video-URL

Enthält die URL des Youtube-Videos.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.9. Hintergrundüberlappung 7-5

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild oder ein Video. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

.Einstellungen Hintergrundüberlappung 7-5

Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Mediumsauswahl

Bestimmt den Typ des Elements. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Lottie Animation

  • Video

Bei Lottie handelt es sich um ein Dateiformat für Animationen. Weitere Informationen findest du im Handbuch von Lottie.

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Lottie.js-JSON-Animationsdatei

Bietet die Möglichkeit, eine Animation aus dem Webspace zu wählen.

Video-URL

Enthält die URL des Youtube-Videos.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.10. Hintergrundüberlappung voller Größe

Mit diesem Widget kannst du ein Bild hinzufügen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 6. Einstellungen Hintergrundüberlappung voller Größe
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Bei Videos wird das Bild als Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.11. Hintergrundüberlappung Lottie

Mit diesem Widget teilst du deinen Inhalt in zwei Bereiche auf. Ein Bereich enthält eine Schaltfläche. Der andere Bereich enthält ein Bild oder eine Animation. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 7. Einstellungen Hintergrundüberlappung Lottie
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Hintergrundtyp

Bestimmt den Typ des Elements, das im Hintergrund angezeigt wird. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Lottie-Animation

Bei Lottie handelt es sich um ein Dateiformat für Animationen. Weitere Informationen findest du im Handbuch von Lottie.

Bildauswahl (Hintergrund)

Bietet die Möglichkeit, ein Hintergrundbild aus dem Webspace zu wählen.

Lottie.js-JSON-Animationsdatei (Hintergrund)

Bietet die Möglichkeit, eine Hintergrundanimation aus dem Webspace zu wählen.

Vordergrundtyp

Bestimmt den Typ des Elements, das im Vordergrund angezeigt wird. Folgende Optionen stehen zu Verfügung:

  • Bild

  • Lottie Animation

Bei Lottie handelt es sich um ein Dateiformat für Animationen. Weitere Informationen findest du im Handbuch von Lottie.

Bildauswahl (Vordergrund)

Bietet die Möglichkeit, ein Vordergrundbild aus dem Webspace zu wählen.

Lottie.js-JSON-Animationsdatei (Vordergrund)

Bietet die Möglichkeit, eine Vordergrundanimation aus dem Webspace zu wählen.

Sichtbarkeit der Schaltfläche

Bestimmt, ob die Schaltfläche angezeigt wird oder nicht.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Verlinkung der Schaltfläche

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

4.12. Bild und Zitat

Mit diesem Widget kannst du ein Bild hinzufügen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 8. Einstellung Bild und Zitat
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Ausrichtung

Bestimmt, ob das Element linksbündig oder rechtsbündig ist.

Bildauswahl

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

5. Karousels

In dieser Widget-Kategorie werden alle Widgets aufgelistet, die du nutzen kannst, um eine Slideshow auf deiner Seite einzubinden.

5.1. Erfahrungsberichte Karussell

Dieses Widget stellt ein Karussell für Erfahrungsberichte zu Verfügung. Du kannst damit z.B. Erfahrungsberichte von deinen Kunden anzeigen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 9. Einstellungen Erfahrungsberichte Karussell
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Karten in der Desktop-Ansicht

Bestimmt wie viele Karten gleichzeitig angezeigt werden, wenn die Seite auf einem Desktop aufgerufen wird.

Karten in der Tablet-Ansicht

Bestimmt wie viele Karten gleichzeitig angezeigt werden, wenn die Seite auf einem Tablet aufgerufen wird.

Karten in der Mobilansicht

Bestimmt wie viele Karten gleichzeitig angezeigt werden, wenn die Seite auf einem mobilen Endgerät aufgerufen werden.

Leerraum mit letzter Karte füllen

Bestimmt, ob die letzte Karte über die gesamte Breite des Elements gestreckt werden soll.

Alle Karten auf dieselbe Höhe setzen

Bestimmt, ob die Höhe der einzelnen Karten den Inhalten der jeweiligen Karte entspricht oder alle Karten an die Höhe der größten Karte angepasst werden.

Profilbild

Bietet die Möglichkeit, ein Profilbild aus dem Webspace zu wählen. Das Profilbild wird auf der linken Seite der Karte angezeigt.

Logo

Bietet die Möglichkeit, ein Logobild aus dem Webspace zu wählen. Das Logo wird auf der rechten Seite der Karte angezeigt.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

5.2. Modulkarussell

Dieses Widget stellt ein Karussell für Karten zu Verfügung. Jede Karte kann ein Bild, einen Text und einen Link beinhalten. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 10. Einstellungen Modulkarussell
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Karten in der Desktop-Ansicht

Bestimmt wie viele Karten gleichzeitig angezeigt werden, wenn die Seite auf einem Desktop aufgerufen wird.

Karten in der Tablet-Ansicht

Bestimmt wie viele Karten gleichzeitig angezeigt werden, wenn die Seite auf einem Tablet aufgerufen wird.

Karten in der Mobilansicht

Bestimmt wie viele Karten gleichzeitig angezeigt werden, wenn die Seite auf einem mobilen Endgerät aufgerufen werden.

Leerraum mit letzter Karte füllen

Bestimmt, ob die letzte Karte über die gesamte Breite des Elements gestreckt werden soll.

Alle Karten auf dieselbe Höhe setzen

Bestimmt, ob die Höhe der einzelnen Karten den Inhalten der jeweiligen Karte entspricht oder alle Karten an die Höhe der größten Karte angepasst werden.

Logo

Bietet die Möglichkeit, ein Logobild aus dem Webspace zu wählen.

Beschriftung des Links

Bestimmt, die Beschriftung der Schaltfläche.

Linkfarbe

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Link

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

6. Karten

In dieser Widget-Kategorie werden alle Widgets aufgelistet, die zum Darstellen von Inhalten auf dafür ausgelegten Karten zu Verfügung stehen.

6.1. Logowand

Mit diesem Widget kannst du viele Bilder auf einmal darstellen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 11. Einstellung Logowand
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Logo

Bietet die Möglichkeit, ein Logobild aus dem Webspace zu wählen.

Link

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

6.2. Eventkarte

Mit diesem Widget kannst du die Daten von wichtigen Events anzeigen, z.B. einer Verkaufsaktion. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 12. Einstellung Eventkarte
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Datum der Veranstaltung

Bestimmt das Datum, an dem das Event stattfindet. Du kannst das Datum entweder in dem Format TT.MM.JJJJ von Hand eingeben oder ein Datum aus dem Kalender wählen.

Uhrzeit der Veranstaltung

Bestimmt die Zeit, zu der das Event stattfindet.

Beschriftung der Schaltfläche

Bestimmt, die Beschriftung der Schaltfläche.

Link für Handlungsaufforderung

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den padding auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

6.3. Videokarte

Mit diesem Widget kannst du ein Youtube-Video auf deiner Seite einbinden. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 13. Einstellungen Videokarte
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Vorschauminiatur

Bietet die Möglichkeit, ein Bild aus dem Webspace zu wählen. Das Bild wird für die Vorschauminiatur verwendet. Wenn du kein Bild auswählst, wird die Vorschauminiatur von Youtube übernommen.

Video-URL

Enthält die URL des Youtube-Videos.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

6.4. Universalkarte

Dieses Widget stellt ein Kartenelement zu Verfügung, das für verschiedene Inhalte eingesetzt werden kann. Du kannst dem Element einen normalen Text, einen Link und ein Bild hinzufügen. Klicke auf Einstellungen, um die Widget-Einstellungen zu öffnen.

Tabelle 14. Einstellungen Universalkarte
Einstellung Erläuterung

CSS-Klasse

Fügt dem Element benutzerdefinierte CSS-Klassen hinzu. Verwende diese Einstellung, wenn du das Styling des Widgets anpassen möchtest und die anderen Einstellungen nicht ausreichen.

Erscheinungsbild

Bestimmt die Hintergrundfarbe des Elements. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Kartenbild anzeigen

Öffnet die Bildeinstellungen. Über die Bildeinstellungen kannst du der Karte ein Bild hinzufügen.

Logo

Bietet die Möglichkeit, ein Logobild aus dem Webspace zu wählen.

Bildgröße

Bestimmt die Größe des Bildes. Folgende Größen stehen zu Verfügung:

  • Volle Größe: Das Bild wird in der Originalgröße angezeigt.

  • Logogröße: Die Größes des Bildes wird nach unten skaliert.

Symbol einblende

Öffnet die Icon-Einstellungen. Über die Einstellungen kannst du der Karte ein Symbol hinzufügen.

Kartensymbol

Bestimmt, ob der Link mit einem Symbol verbunden ist. Folgende Symbole stehen zu Verfügung:

  • Email

  • Benutzer

  • Externer Link

  • Pfeil

  • Fragezeichen

  • Angabe

  • Geprüft

  • Ausrufezeichen

Linkformatierung

Bestimmt die Art des Links. Folgende Optionen stehen zu Verfügung:

  • Kein Link

  • Text

  • Schaltfläche

Beschriftung des Links

Bestimmt, die Beschriftung der Schaltfläche.

Schaltflächenklasse

Bestimmt die Hintergrundfarbe der Schaltfläche. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Linkfarbe

Bestimmt die Farbe des Links. Du kannst die Farben ändern, indem du die Werte in den Einstellungen von Ceres anpasst.

Link

Bestimmt das Ziel des Links. Folgende Optionen stehen zu Verfügung:

  • Kategorie

  • Externer Link

  • Datei (Webspace)

  • Varianten-ID

Wenn du möchtest, dass sich der Link in einem neuen Browser-Tab öffnet, wähle die Option In neuem Tab öffnen.

Bild vorladen

Wenn du diese Option wählst, wird das Bild beim Laden der Seite priorisiert. Du solltest diese Option nur dann wählen, wenn du das Bild einem Bereich platzieren möchtest, der beim Aufrufen der Seite direkt sichtbar ist.

Nur sichtbare Inhalte laden

Wenn du diese Option wählst, wird das Bild nur geladen, wenn es auch auf der Seite sichtbar wird. Verzögerst du so das Laden eines Bilds, das beim ersten Seitenaufruf nicht sichtbar ist, wird die Gesamtladezeit der Seite verbessert.

Innenabstand ändern

Bestimmt den Abstand zwischen Elementen, die sich innerhalb des Widgets befinden. Wenn du den Innenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.

Außenabstand ändern

Bestimmt den Abstand zwischen den Elementen des Widgets und Elementen außerhalb des Widgets. Wenn du den Außenabstand auf auto setzt, wird der Wert von dem Element übernommen, in dem dieses Widget enthalten ist.