Darstellung & Widget-Vorlagen
Passen Sie das Aussehen der Widgets an, wählen Sie Anzeigemodi, steuern Sie Sichtbarkeitsoptionen und verwalten Sie HTML/CSS-Vorlagen für jeden Widget-Typ.
Darstellung & Widget-Vorlagen
Legen Sie fest, wie jedes Umbrella-Widget in Ihrem Shop aussieht und sich verhält. Wählen Sie in der Seitenleiste einen Widget-Typ aus und konfigurieren Sie ihn dann über drei Tabs:
- Einstellungen — Funktionen ein- und ausschalten, Anzeigemodi wählen, Sichtbarkeit steuern
- Vorlage — HTML und CSS im Code-Editor bearbeiten
- Sprachen — Übersetzungstexte für mehrsprachige Shops verwalten
Widget-Typen
Produktseite (PDP)
- PDP-Widget — die zentrale Garantieangebotskarte auf Produktseiten
- PDP-OEM-Widget — Informationen zur Herstellergarantie
- Auswahl-Modal — Pop-up zur Auswahl der Garantieoptionen
- Info-Modal — Pop-up mit Details zum Garantieschutz
Warenkorb
- Warenkorb geschützt — Statuskarte für Artikel mit Garantieschutz
- Warenkorb ungeschützt — Upsell-Karte für Artikel ohne Garantieschutz
Bestellstatus
- Bestellstatus-Widget — Garantiedetails auf den Bestellbestätigungs- bzw. Bestellstatusseiten
- Bestellstatus-Modal — ausführliches Garantie-Modal, das von der Bestellstatusseite aus geöffnet wird
Nach dem Kauf
- Karte nach dem Kauf — Garantie-Upsell auf Bestellstatusseiten für nicht gedeckte Produkte
- Modal nach dem Kauf — Auswahl-Modal für Upsells nach dem Kauf
Versandschutz
- Versandschutz-Widget — Versandschutz-Angebot auf der Warenkorbseite
- Versandschutz-Modal — Info-Modal mit Details zum Versandschutz
Einstellungen des PDP-Widgets
Das zentrale Garantieangebot auf Produktdetailseiten. Mit PDP-Karte aktivieren blenden Sie es ein oder aus.
Anzeigemodus
| Modus | Beschreibung |
|---|---|
| Inline | Die Garantieoptionen erscheinen direkt auf der Seite als auswählbare Karten |
| Modal | Eine Schaltfläche oder ein Banner öffnet ein Modal mit den Garantieoptionen |
| Einzeln | Jede Garantieoption wird als eigenständige Karte dargestellt |
Nur im Inline-Modus
- Option muss gewählt werden — Kunden müssen eine Garantieoption auswählen, bevor sie das Produkt in den Warenkorb legen
- Erste Option automatisch auswählen — der erste Plan ist vorausgewählt (Kunden können ihn ändern oder abwählen)
- Option „Kein Schutz“ anzeigen — zeigt eine Option „Nein, danke“ an, mit der Kunden ausdrücklich ablehnen können
Weitere Optionen
- Modal beim Hinzufügen zum Warenkorb öffnen — ist keine Garantie ausgewählt, erscheint ein Modal, bevor der Artikel hinzugefügt wird
- Benutzerdefinierter Einfüge-Selektor — CSS-Selektor, mit dem Sie steuern, wo das Widget auf Ihrer Seite platziert wird
- Benutzerdefinierte Einfügeposition — Außen oben, Innen oben, Innen unten oder Außen unten
- Benutzerdefinierte Vorlage verwenden — eigenes HTML/CSS statt des Standarddesigns verwenden
- Umbrella-Branding ausblenden — entfernt die Fußzeile „Powered by Umbrella“
Einstellungen des PDP-OEM-Widgets
Zeigt Informationen zur Herstellergarantie (OEM) auf Produktseiten an, getrennt von den Angeboten für erweiterte Garantien.
- OEM-Widget aktivieren — das OEM-Widget ein- oder ausblenden
- Schutzdetails ausblenden — die ausführliche Deckungsbeschreibung ausblenden
- Garantiedauer ausblenden — die Anzeige der Garantielaufzeit ausblenden
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen des Auswahl-Modals
Pop-up, das die Garantieoptionen anzeigt. Es wird über das PDP-Widget, den Warenkorb oder beim Hinzufügen zum Warenkorb geöffnet.
- Auswahl-Modal aktivieren
- Anzeigemodus — Inline (auswählbare Karten) oder Einzeln (eigenständige Karten)
- Option muss gewählt werden — vor dem Schließen ist eine Auswahl erforderlich
- Erste Option automatisch auswählen — die erste Option ist vorausgewählt (nur im Inline-Modus)
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen des Info-Modals
Zeigt ausführliche Informationen zum Garantieschutz an, wenn Kunden auf die Info- bzw. Details-Schaltfläche klicken.
- Info-Modal aktivieren
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen des Widgets „Warenkorb geschützt“
Erscheint bei Warenkorbartikeln, die bereits Garantieschutz haben.
- Karte für geschützte Warenkorbartikel aktivieren
- Schaltfläche für Info-Modal anzeigen — Kunden können die Garantiedetails ansehen
- Schaltfläche „Schutz entfernen“ anzeigen — Kunden können den Garantieschutz entfernen
- Position der erweiterten Garantie im Warenkorb ausblenden — Garantiedetails nur innerhalb der Produktkarte anzeigen
- Preisstufe der Position für die erweiterte Garantie ausblenden — die Preisstufe in der Garantieposition ausblenden
- Details der Position für die erweiterte Garantie ausblenden — ausführliche Garantieinformationen in der Position ausblenden
- Zum Gesamtbetrag der geschützten Position hinzufügen — den Garantiepreis mit dem angezeigten Gesamtbetrag des Produkts zusammenfassen
- Interaktionen mit der Garantieposition deaktivieren — verhindert Mengenänderungen an der Garantieposition
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen des Widgets „Warenkorb ungeschützt“
Erscheint bei Warenkorbartikeln ohne Garantieschutz und bietet Kunden die Möglichkeit, eine Deckung hinzuzufügen.
- Karte für ungeschützte Warenkorbartikel aktivieren
- Anzeigemodus — Modal, Inline oder Einzeln
- Nur im Inline-Modus: Option muss gewählt werden, Erste Option automatisch auswählen, Option „Kein Schutz“ anzeigen
- Schaltfläche für Info-Modal anzeigen
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen des Bestellstatus-Widgets
Zeigt Informationen zur Garantiepolice auf Bestellbestätigungs- und Bestellstatusseiten an.
- Bestellstatus-Widget aktivieren
- Info-Schaltfläche ausblenden / Anspruchs-Schaltfläche ausblenden / Statusanzeige ausblenden / Garantielaufzeit ausblenden / Informationen zum Anspruchsfenster ausblenden
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen des Bestellstatus-Modals
Ausführliches Modal mit allen Details zur Garantiepolice, erreichbar über das Bestellstatus-Widget.
- Bestellstatus-Modal aktivieren
- Policen-ID ausblenden / Startdatum ausblenden / Enddatum ausblenden / Schaltfläche „Police anzeigen“ ausblenden / Schaltfläche „Anspruch einreichen“ ausblenden
- Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Einstellungen von Karte & Modal nach dem Kauf
Karte nach dem Kauf — Garantie-Upsell auf Bestellstatusseiten für nicht gedeckte Produkte. Schalten Sie Widget nach dem Kauf aktivieren ein.
Modal nach dem Kauf — Auswahl-Modal, das sich über die Upsell-Karte öffnet. Schalten Sie Modal nach dem Kauf aktivieren ein.
Beide unterstützen Benutzerdefinierte Vorlage verwenden und Umbrella-Branding ausblenden.
Einstellungen des Versandschutz-Widgets
Versandschutz-Angebot auf der Warenkorbseite.
- Widget für den Versandschutz aktivieren
- Anzeigemodus — Schaltflächenauswahl (zwei Schaltflächen: hinzufügen/ablehnen) oder Kontrollkästchen (ein einzelner Schalter)
- Optionen bei Schaltflächenauswahl: Benutzerdefinierter Checkout-Button (HTML) (unterstützt
{{{total}}}und{{{price}}}) und Benutzerdefinierter Text für „Ohne fortfahren“ - Benutzerdefinierte Vorlage verwenden / Umbrella-Branding ausblenden
Versandschutz-Modal — Info-Modal mit Details zum Versandschutz. Schalten Sie Versandschutz-Modal aktivieren ein.
Vorlagen-Editor
Jedes Widget hat seine eigene HTML- und CSS-Vorlage. Sie erreichen sie über den Tab Vorlage.
- HTML-Editor — verwendet Handlebars-Syntax (
{{variable}}für maskierte Ausgabe,{{{variable}}}für rohes HTML). Die verfügbaren Variablen sind im Bereich „Anweisungen“ aufgeführt. - CSS-Editor — die Styles gelten nur für das ausgewählte Widget, damit es keine Konflikte mit Ihrem Theme gibt.
- Vorschaubereich — Live-Darstellung mit Beispieldaten. Schalten Sie zwischen hellem und dunklem Modus, Anzahl der Optionen, Auswahlzustand und Ablaufzuständen um.
Klicken Sie auf Auf Standardwerte zurücksetzen, um die ursprüngliche Vorlage wiederherzustellen, falls Ihre Anpassungen Probleme verursachen.
Tab „Sprachen“
Verwalten Sie die Übersetzungstexte jedes Widgets, um mehrsprachige Shops zu unterstützen. Sie können Übersetzungsschlüssel für jede unterstützte Sprache ansehen, hinzufügen und bearbeiten.
Verwandte Themen
- Allgemeine Einstellungen — Währung und Länderbeschränkungen
- Benachrichtigungen — E-Mail-Benachrichtigungen zu Garantieereignissen
- E-Mail-Vorlagen — das Design von Transaktions-E-Mails anpassen


