Übersicht
Das Feature “Scripts & Consent” vereinfacht die Integration externer Skripte wie Tracking-Codes, Social Media Feeds oder Kundenchat-Widgets in deinen Online-Shop, und das völlig codefrei. Es gewährleistet, dass solche Einbindungen stets den Datenschutzvorschriften der DSGVO entsprechen. Mit dieser Funktion kannst du nicht nur externe Dienste leicht in deinen Shop integrieren, sondern auch CSS-Eigenschaften anpassen, um das Erscheinungsbild dieser Dienste nahtlos an dein Shop-Design anzupassen. Dieses Tool erleichtert die Personalisierung deines Shops und die Verbesserung des Kundenerlebnisses, während es gleichzeitig den Datenschutz respektiert.Features
Flexible Script-Einbindung
Binde Skripte im Header, Footer, als Portlet oder per CSS-Selektor ein - je nach Anforderung des externen Dienstes.
DSGVO-Konformität
Erstelle Consent-Items und binde Skripte daran - so werden externe Dienste erst nach Zustimmung geladen.
Kein Code nötig
Integriere komplexe Skripte ohne Programmierkenntnisse durch intuitive Benutzeroberfläche.
CSS-Anpassungen
Passe das Erscheinungsbild externer Dienste mit Custom CSS an dein Shop-Design an.
Script-Einbindung
Script erstellen

Script-Name vergeben
Vergebe einen eindeutigen, aussagekräftigen Namen für das Script, z.B. “Google Analytics” oder “Facebook Pixel”.
An Consent binden (optional)
Entscheide, ob das Script DSGVO-konform erst nach Zustimmung geladen werden soll.
Ausgabetypen erklärt
- Header
- Portlet
- Selektor
Verwendung: Scripte oder Styles, die möglichst früh aufgerufen werden sollenTypische Anwendungsfälle:
- Analytics-Tracking-Codes (Google Analytics, Matomo)
- Meta-Tags für Social Media
- CSS-Dateien, die vor dem Seitenaufbau geladen werden müssen
- Font-Loader
Script-Einstellungen
Grundeinstellungen
Vergebe hier einen eindeutigen Namen für das Script, z.B. “Google Analytics Tracking” oder “Facebook Pixel”.
Wähle den Ausgabetyp:
- Header - Für früh zu ladende Scripts/Styles
- Footer - Für die meisten Scripts und schwebende Widgets
- Portlet - Für flexible Platzierung im OPC
- Selektor - Für dynamisches Einfügen in Template-Elemente
Nur bei Ausgabetyp “Selektor”: CSS-Selektor als ID (#meine-id) oder Klasse (.meine-klasse)
Füge hier das Script oder CSS-Stylesheet ein. Unterstützt HTML, JavaScript und CSS.
Vorhandene Scripts

Der vergebene Name des Scripts.
Eindeutige ID des Scripts, wird automatisch aus dem Namen generiert.
Der gewählte Ausgabetyp (z.B. Header, Footer, Portlet).
Der CSS-Selektor, sofern der Ausgabetyp “Selektor” gewählt wurde.
Das verknüpfte Consent-Item. Ein Strich (–) bedeutet, das Script wird ohne Consent-Bindung geladen.
Consent Item bearbeiten

Sprachvariablen sind besonders praktisch für mehrsprachige Shops. Lege sie unter Sprachvariablen im Resources & Health Dashboard mit der Sektion “custom” an.
Setzt alle Felder des Formulars auf ihre Ausgangswerte zurück.
Name des Consent-Items, z.B. “Google Analytics”. Alternativ eine Sprachvariable im rechten Feld eintragen.
Beschreibt, was der Dienst macht – wird dem Nutzer im Consent-Banner angezeigt. Alternativ Sprachvariable verwenden.
Zweck der Datenerhebung, z.B. “Analyse des Nutzerverhaltens”. Alternativ Sprachvariable verwenden.
Link zur Datenschutzerklärung des Dienstes (optional). Alternativ Sprachvariable verwenden.
Name des datenverarbeitenden Unternehmens, z.B. “Google Ireland Limited, Dublin, Irland”.
Speichert das Consent-Item. Es steht anschließend in der Dropdown-Liste bei der Script-Konfiguration zur Verfügung.
Verwaltung
Consent-Item-Verwaltung

- Name und Details: Alle wichtigen Informationen auf einen Blick
- Gebundene Scripts: Anzahl der Scripts, die an dieses Item gebunden sind
- Bearbeiten: Klicke auf ein Item, um dessen Einstellungen anzupassen
- Löschen: Hake Items an und klicke auf den gelben Button zum Entfernen
Best Practices
DSGVO-Compliance sicherstellen
DSGVO-Compliance sicherstellen
Grundregeln:
- Alle Marketing- und Tracking-Scripts MÜSSEN an Consent-Items gebunden sein
- Erstelle aussagekräftige Consent-Beschreibungen in einfacher Sprache
- Verlinke immer auf die Datenschutzerklärung des Dienstes
- Gib das verarbeitende Unternehmen vollständig an
Performance optimieren
Performance optimieren
Header sparsam nutzen:
Nur kritische Scripts in den Header, da sie die Ladezeit beeinflussenAsync/Defer verwenden:Footer bevorzugen:
Die meisten Scripts funktionieren auch im Footer und verbessern so die Performance
Dokumentation pflegen
Dokumentation pflegen
Klare Namen verwenden:
“Google Analytics 4 - Tracking” statt “Script 1”Kommentare hinzufügen:Änderungen dokumentieren:
Notiere wichtige Änderungen als Kommentar im Code
Testen vor dem Go-Live
Testen vor dem Go-Live
Checklist:
- Script lädt korrekt im gewählten Bereich
- Consent-Bindung funktioniert (Script wird erst nach Zustimmung geladen)
- Keine Fehler in der Browser-Konsole
- Funktionalität des Scripts ist gegeben
- Mobile Ansicht geprüft
- Performance-Impact akzeptabel
Häufige Anwendungsfälle
- Google Analytics 4
- Facebook Pixel
- Trustpilot Widget
- Userlike Chat
Ausgabetyp: Header
Consent: Marketing/Analytics
Consent: Marketing/Analytics
Fehlerbehebung
Script wird nicht geladen
Script wird nicht geladen
Mögliche Ursachen:
- Consent wurde noch nicht erteilt (prüfe Consent-Bindung)
- JavaScript-Fehler blockiert Ausführung (Browser-Konsole prüfen)
- Falscher Ausgabetyp gewählt
- Script-URL ist nicht erreichbar
- Öffne die Browser-Konsole (F12)
- Prüfe auf Fehlermeldungen
- Teste ohne Consent-Bindung
- Prüfe, ob die externe URL erreichbar ist
Script lädt, funktioniert aber nicht
Script lädt, funktioniert aber nicht
Typische Probleme:
- Abhängigkeiten fehlen (z.B. jQuery wird benötigt)
- Script lädt zu früh/spät (Ausgabetyp ändern)
- Konflikte mit anderen Scripts
- Falsche Konfiguration im Script-Code
- Prüfe die Dokumentation des externen Dienstes
- Teste verschiedene Ausgabetypen (Header vs. Footer)
- Lade benötigte Bibliotheken zuerst
- Prüfe die Browser-Konsole auf Fehler
Consent-Item erscheint nicht
Consent-Item erscheint nicht
Prüfe:
- Wurde das Consent-Item gespeichert?
- Ist es an ein Script gebunden?
- Cache geleert?
- Consent Manager aktiv im Template?
- Leere den Shop-Cache
- Prüfe unter “Consent-Item-Verwaltung” die Übersicht
- Stelle sicher, dass der JTL Consent Manager aktiviert ist
Portlet erscheint nicht im OPC
Portlet erscheint nicht im OPC
Häufige Ursachen:
- Plugin-Cache nicht geleert
- OPC-Cache aktiv
- Falscher Ausgabetyp
- Leere den Plugin-Cache
- Leere den OPC-Cache
- Öffne den OPC-Editor neu
- Suche nach “Script Portlet” in der Portlet-Liste
Pro-Tipp: Erstelle eine Testseite in deinem Shop, auf der du neue Scripts erst testest, bevor du sie live schaltest. So vermeidest du Fehler auf produktiven Seiten.