Wichtige Erkenntnisse
- Die empfohlene Methode für das Checkout- und Purchase-Tracking ist Einstellungen → Kundenereignisse (Shopifys Pixel-Manager).
- Verwende für app-spezifische Skripte App-Embeds im Theme-Editor, anstatt Code manuell in die theme.liquid einzufügen.
- Der Zugriff von Drittanbieter-Skripten auf die Checkout-Seite ist bei Basic- und Shopify-Plänen begrenzt – Shopify Plus bietet hier mehr Möglichkeiten.
- Das direkte Hinzufügen von Skripten in die theme.liquid ist die leistungsstärkste, aber am wenigsten sichere Methode – dupliziere zuerst dein Theme.
Tracking-Skripte bilden die Basis für deine Werbeanzeigen, Analysen und Remarketing. Die korrekte Installation in Shopify ist etwas komplexer als das bloße Einfügen eines Snippets in den Header. Shopify bietet mehrere Methoden an, die jeweils für unterschiedliche Anwendungsfälle geeignet sind.
Wie füge ich einen Tracking-Code zu Shopify hinzu?
Es gibt drei Hauptmethoden:
- Kundenereignisse (Pixel-Manager) – für das Tracking von Purchase- und Checkout-Events
- App-Embeds – für app-spezifische Skripte
- theme.liquid – für globale Skripte auf allen Seiten (außer dem Checkout bei kleineren Plänen)
Methode 1 – Kundenereignisse (empfohlen für Conversion-Tracking)
Das Kundenereignisse-System von Shopify (früher Shopify Pixels) ist der richtige Ort für das Tracking von Purchase- und Checkout-Events. Es funktioniert über den gesamten Checkout hinweg – einschließlich der Bestellbestätigungsseite – und das in allen Shopify-Plänen.
Schritt 1 - Gehe zu Einstellungen → Kundenereignisse
Schritt 2 - Klicke auf „Benutzerdefiniertes Pixel hinzufügen“ (für eigenen Code) oder durchsuche die Liste der vorgefertigten Integrationen (Google, Meta, TikTok, Klaviyo, etc.).
Schritt 3 - Bei einer vorgefertigten Integration: Klicke auf die Integration, verbinde dein Konto und aktiviere sie. Shopify erledigt den Rest.
Schritt 4 - Bei einem benutzerdefinierten Pixel: Füge deinen Tracking-Code in den JavaScript-Editor ein. Dein Code wird in einer Sandbox-Umgebung ausgeführt und hat Zugriff auf die Standard-Events von Shopify (page_viewed, product_viewed, checkout_completed, etc.).
Warum dies der empfohlene Ansatz ist: Kundenereignisse werden in einer datenschutzkonformen Sandbox ausgeführt, berücksichtigen die Consent-Einstellungen der Kunden und haben vollen Zugriff auf Checkout-Events, die Skripte in der theme.liquid bei Standard-Plänen nicht erreichen können.
Methode 2 – App-Embeds im Theme-Editor
Wenn du eine Shopify-App installierst, die ein JavaScript-Snippet enthält (wie ein Review-Widget, Live-Chat oder Treueprogramm), ist der richtige Weg zur Aktivierung über die App-Embeds:
Schritt 1 - Gehe zu Onlineshop → Themes → Anpassen
Schritt 2 - Klicke auf das Puzzleteil-Symbol in der linken Seitenleiste (App-Embeds)
Schritt 3 - Aktiviere die App, die du nutzen möchtest
Diese Methode hält App-Skripte organisiert, ermöglicht ein einfaches Aktivieren/Deaktivieren ohne Code-Eingriffe und vermeidet verwaiste Script-Tags, falls du die App später deinstallierst.
Methode 3 – theme.liquid (für globale Skripte)
Für Skripte, die auf jeder Seite deines Shops ausgeführt werden müssen (ausgenommen der Checkout bei kleineren Plänen), kannst du diese direkt in die theme.liquid einfügen.
Schritt 1 - Onlineshop → Themes → Aktionen → Code bearbeiten
Schritt 2 - Öffne die theme.liquid
Schritt 3 - Füge Skripte im <head>-Bereich ein (für Skripte, die früh geladen werden müssen) oder direkt vor dem schließenden </body>-Tag (für unkritische Skripte).
Dupliziere immer zuerst dein Theme. Ein Syntaxfehler in der theme.liquid kann deinen gesamten Storefront lahmlegen.
Verwende nach Möglichkeit defer oder async bei Script-Tags, um das Rendern der Seite nicht zu blockieren:
<script src="https://example.com/script.js" defer></script>Wie füge ich in Shopify ein Skript zur Checkout-Seite hinzu?
Der Zugriff auf Skripte für die Checkout-Seite hängt von deinem Shopify-Plan ab:
Basic-, Shopify-, Advanced-Pläne: Skripte können nicht direkt über die theme.liquid zu Checkout-Seiten hinzugefügt werden. Nutze stattdessen die Kundenereignisse – diese haben Zugriff auf alle Checkout-Events.
Shopify Plus: Zugriff auf checkout.liquid für die Checkout-Seite. Bietet zudem Shopify Functions und Checkout Extensibility für fortgeschrittene Anpassungen.
Alle Pläne: Die Bestellbestätigungsseite (Thank-you-Page) kann zusätzliche Skripte über Einstellungen → Checkout → Bestellstatusseite aufnehmen (scrolle auf der Checkout-Einstellungsseite ganz nach unten zum Feld „Zusätzliche Skripte“).
Häufige Fehler bei Tracking-Skripten
Ein Pixel doppelt installieren. Wenn du die native Meta-Integration von Shopify nutzt UND den Meta-Pixel-Code manuell in die theme.liquid einfügst, werden Purchase-Events doppelt ausgelöst. Nutze nur eine Methode.
Fehlendes Consent-Management. Wenn du in der EU oder Kalifornien tätig bist, benötigst du einen Cookie-Banner, und deine Tracking-Skripte dürfen nur bei expliziter Zustimmung der Nutzer ausgelöst werden. Das Kundenereignisse-System handhabt dies bei korrekter Konfiguration ordnungsgemäß.
Skripte, die das Laden der Seite blockieren. Skripte im <head>, die das Rendering blockieren, verzögern die Anzeige deiner Seite. Füge async- oder defer-Attribute zu allen nicht kritischen Tracking-Skripten hinzu.
Google Tag Manager als Single Source of Truth nutzen
Anstatt mehrere Tracking-Skripte direkt in Shopify einzufügen, nutzen viele Shops den Google Tag Manager (GTM) als Container. Du fügst das GTM-Snippet einmal in die theme.liquid ein und verwaltest dann alle anderen Tracking-Skripte innerhalb des GTM.
Vorteile: Keine Code-Änderungen bei neuen oder modifizierten Trackings nötig, einfacheres Hinzufügen/Entfernen von Skripten für Nicht-Entwickler, integrierte Debugging-Tools.
Sieh dir unseren vollständigen Guide an: So fügst du den Google Tag Manager zu Shopify hinzu.
