Widget-Einbindung auf Ihrer Website
Die Widget-Einbindung wurde überarbeitet und lädt jetzt zentral vom Mein-Fahrzeugshop-CDN. Bestehende Einbindungen werden im Rahmen der Umstellung aktualisiert.
Neben dem vollständigen Shop können Sie einzelne Widgets auf beliebigen Seiten Ihrer Website einbinden — z. B. ein Fahrzeug-Karussell auf der Startseite oder eine Suchleiste im Header.
Verfügbare Widgets
| Widget | Beschreibung |
|---|---|
| Fahrzeug-Karussell | Zeigt eine Auswahl Ihrer Fahrzeuge als Karussell |
| Schnellsuche | Kompakter Such-Filter für den schnellen Einstieg |
| Volltextsuche | Freitext-Suchfeld über den gesamten Fahrzeugbestand |
Einbindung
Schritt 1 — Widget-Bibliothek einbinden
Fügen Sie die Widget-Bibliothek einmal pro Seite ein, auf der Widgets erscheinen sollen — vorzugsweise vor dem schließenden </body>-Tag:
<script src="https://cdn.meinfahrzeugshop.com/v1/widgets/wrapper.js" async></script>
Schritt 2 — Widget platzieren
Fügen Sie an der gewünschten Stelle das Widget-Element ein. Den fertigen Code mit Ihren individuellen Werten finden Sie im Admin-Bereich unter Integration — kopieren Sie ihn von dort.
Das Widget ist ein eigenständiges HTML-Element, das sich seine Daten (Theme, Logo, Fahrzeuge) automatisch aus der zentralen Datenbank holt:
<custom-elements-wrapper
tenant-admin-id="IHRE-MANDANTEN-UUID"
widget-type="1"
></custom-elements-wrapper>
Der widget-type bestimmt, welches Widget gerendert wird:
widget-type | Widget |
|---|---|
1 | Fahrzeug-Karussell |
2 | Schnellsuche |
3 | Volltextsuche |
Sie können mehrere Widgets auf derselben Seite platzieren — die Bibliothek aus Schritt 1 muss nur einmal eingebunden werden.
Wie es funktioniert
wrapper.js registriert das <custom-elements-wrapper>-Element. Sobald es im Sichtbereich erscheint, lädt es Ihre kundenspezifischen Einstellungen (Farben, Schriftarten, Logo) und die passenden Fahrzeugdaten aus dem Backend. Sie müssen nichts konfigurieren — Änderungen im Admin-Bereich sind nach einem Reload sofort sichtbar.
Troubleshooting
| Symptom | Mögliche Ursache | Lösung |
|---|---|---|
| Widget bleibt leer | wrapper.js fehlt oder wurde nach dem Widget-Element geladen | Bibliothek aus Schritt 1 einbinden |
| Falsche Fahrzeuge / falsches Theme | Falsche Mandanten-UUID im Widget-Element | Code erneut aus dem Admin-Bereich kopieren |
Bei weiteren Fragen wenden Sie sich an den Support.
Verwenden Sie ausschließlich die Code-Snippets aus Ihrem eigenen Admin-Dashboard unter Integration. Beispielcode aus dieser Dokumentation darf nicht auf Live-Seiten verwendet werden — er enthält Platzhalter-Werte.