In diesem Guide erfährst du Schritt für Schritt, wie du dein Google Tag Manager (GTM) mit deinem Shopify-Shop verbindest – inklusive Einrichtung über das neue Web-Pixel-System von Shopify. Damit legst du eine solide Basis für das Tracking von Seitenaufrufen, Events und E-Commerce-Daten. Zudem bekommst du Tipps zur Debugging-Kontrolle und zu häufigen Stolperfallen.
Übersicht
- Was ist der Google Tag Manager?
- Wie der Google Tag Manager funktioniert – einfach erklärt
- Was ist der Shopify Web Pixel?
- Warum GTM mit Shopify Web Pixel verbinden?
- Google Tag Manager und Shopify Web Pixel einrichten
- Google Tag Manager einrichten
- Integration in Shopify
- Shopify Customer Events
- Integrierte Events testen / debuggen
- FAQ
Was ist der Google Tag Manager
Der Google Tag Manager (GTM) ist ein kostenloses Tool von Google, das die Verwaltung von Tracking- und Marketing-Daten erheblich vereinfacht. Anstatt für jedes Analyse- oder Werbe-Tool einzelne Code-Snippets manuell in den Website-Code einzubauen, übernimmt der GTM diese Aufgabe zentral. Er funktioniert wie eine digitale Schaltzentrale (siehe Abb. 1): Alle wichtigen Nutzungs- und Tracking-Daten laufen hier zusammen und werden anschließend gezielt an die entsprechenden Systeme weitergeleitet – etwa an Google Analytics 4 (GA4), Google Ads, Hotjar oder andere Plattformen. So behältst du die volle Kontrolle darüber, welche Daten erfasst werden und wohin sie fließen, ohne in den technischen Aufbau deiner Website eingreifen zu müssen. Für Marketing-Teams und Shopbetreiber ist der Google Tag Manager damit ein unverzichtbares Werkzeug, um sauberes, flexibles und datenschutzkonformes Tracking sicherzustellen.
Abb. 1: Funktionsweise des Google Tag Managers als zentrale Steuereinheit für Nutzer- und Trackingdaten
Warum der Google Tag Manager die bessere Lösung für dein Tracking ist
Immer dann, wenn du ein Analyse- oder Marketing-Tool wie Google Analytics, Google Ads, Meta Pixel oder Hotjar nutzen möchtest, muss deine Website diese Tools technisch anbinden. Das geschieht normalerweise, indem für jedes einzelne Tool ein eigener Code in den Website-Code eingefügt wird – oder indem du eine separate Shopify-App installierst, die diese Integration übernimmt.
Nachteile alternativer Integrationsmethoden
- Manuelle Code-Einbindung erfordert jedes Mal die Hilfe eines Entwicklers oder technischen Experten.
- Shopify-Apps sind zwar einfacher, schränken dich aber häufig ein – etwa, wenn es darum geht, genau zu steuern, welche Daten erfasst oder weitergegeben werden sollen.
Der Google Tag Manager (GTM) bietet hier die clevere Lösung: Du stellst einmalig eine Verbindung zwischen deinem Shopify-Shop und dem GTM her. Danach kannst du alle deine Marketing- und Analyse-Tools zentral über den GTM verwalten, ohne erneut in den Website-Code eingreifen zu müssen. Das spart Zeit, reduziert Fehlerquellen und gibt dir deutlich mehr Kontrolle über deine Tracking-Daten.
Wie der Google Tag Manager funktioniert – einfach erklärt
Die wichtigsten drei Bausteine des GTM’s sind die sog. Tags, Trigger und Variablen. Um zu verstehen, wie der Google Tag Manager (GTM) arbeitet, hilft ein Vergleich aus dem Alltag: Stell dir vor, dein GTM ist eine gut organisierte Steckdosenleiste in deinem Zuhause. Du schließt dort alle Geräte an – Fernseher, Lampe, Laptop, Ladegerät (entsprechend GA4, GAds, Hotjar und weiteren Tools) – und steuerst sie zentral, ohne für jedes Gerät eine neue Steckdose in der Wand installieren zu müssen.
🏷️ Tags — Die Geräte
Tags sind wie die elektrischen Geräte, die du in die Steckdosenleiste einsteckst. Jedes Gerät (also jeder Tag) hat eine bestimmte Aufgabe:
- Dein „Fernseher“ ist z. B. Google Analytics, das misst, wer deine Website besucht.
- Deine „Lampe“ ist Google Ads, das Conversions erfasst.
- Dein „Radio“ ist vielleicht ein Meta Pixel, das deine Werbekampagnen mit Facebook verbindet.
Jedes Gerät will also „Strom“, sprich: Daten, um zu funktionieren.
🔌 Trigger — Der Lichtschalter
Trigger sind die Schalter, die bestimmen, wann ein Gerät eingeschaltet wird. Ein Beispiel:
- Der „Lichtschalter“ für deinen Analytics-Tag schaltet sich jedes Mal ein, wenn jemand deine Website aufruft.
- Der „Schalter“ für den Kauf-Tag aktiviert sich nur, wenn jemand im Checkout auf „Jetzt kaufen“ klickt.
Ohne einen passenden Trigger bleibt dein Tag ausgeschaltet – er weiß schlicht nicht, wann er aktiv werden soll.
⚙️ Variablen — Die Informationen
Variablen sind wie die Informationen oder Einstellungen, die bestimmen, wie deine Geräte reagieren. Zum Beispiel:
- Welche Helligkeit deine Lampe haben soll (= wie detailliert du trackst)
- Welche Sendung im Fernseher läuft (= welches Produkt gekauft wurde) Oder welche Lautstärke dein Radio hat (= welcher Umsatzwert übermittelt wird)
Im GTM liefern Variablen also zusätzliche Daten, die deine Tags brauchen, um korrekt zu arbeiten – etwa Produktnamen, Preise oder Seiten-URLs.
Zusammenspiel: Alles arbeitet Hand in Hand
Wenn jemand deinen Shop besucht, läuft das im Hintergrund etwa so ab:
- Der Trigger merkt: „Jemand hat die Seite geöffnet!“
- Er schaltet den passenden Tag ein – z. B. Google Analytics.
- Der Tag fragt mithilfe der Variablen ab, welche Seite es ist und welche Daten übergeben werden sollen.
- Diese Informationen werden dann sauber an dein Analyse- oder Marketing-Tool gesendet.
Brauchst du Unterstützung bei deinem Google Tag Manager?
Ich helfe dir bei der technisch sauberen Integration in Shopify, damit dein Tracking von Anfang an präzise, stabil und DSGVO-konform läuft.
Marc – Seamless Convert
Gründer
Was ist der Shopify Web Pixel
Mit dem Shopify Pixel Manager kannst du alle Tracking-Pixel zentral verwalten und neue hinzufügen, um Kundenaktionen wie Klicks, Seitenaufrufe oder das Hinzufügen eines Produkts zum Warenkorb zu erfassen. Diese Pixel werden im Bereich „Kundenereignisse“ deines Shopify-Adminbereichs eingerichtet und gesteuert. Früher mussten Händler Tracking-Skripte manuell an verschiedenen Stellen ihres Shops einfügen – ein fehleranfälliger und zeitintensiver Prozess. Der Pixel Manager vereinfacht das deutlich: Alle Skripte werden nun in einer zentralen, sicheren Umgebung (Sandbox) ausgeführt und lassen sich bequem über ein Tool verwalten. Dadurch profitierst du von einer sauberen, stabilen und leichter wartbaren Tracking-Struktur.
Du möchtest mehr über das Shopify Pixel wissen?
Mehr findest du in der offiziellen Dokumentation von Shopify: Shopify Dokumentation
Warum GTM mit Shopify Web Pixel verbinden?
Im Folgenden werden die Vor- und Nachteile des Google Tag Manager und Shopify Web Pixel aufgeführt.
Google Tag Manager — Vor- und Nachteile
Vorteile GTM:
- Zentrale Verwaltung
Mit GTM verwaltest du zentral alle Tracking-Skripte (z. B. für Google Analytics 4 (GA4), Google Ads, Facebook, etc.) – ohne jedes Mal in den Theme-Code eingreifen zu müssen. - Mehr Flexibilität
Du kannst Trigger, Variablen und Tags flexibel anpassen und z. B. Add-to-Cart, Checkout-Beginn oder Kauf-Events einsammeln.
- Einfache Verwaltung des Cookie Consent
Der Google Tag Manager (GTM) bietet eine flexible Möglichkeit, den Cookie-Consent-Prozess technisch sauber umzusetzen. Du kannst genau steuern, welche Tracking-Tags nur nach entsprechender Zustimmung (z. B. Marketing, Statistik oder Funktional) aktiviert oder blockiert werden.
Nachteile GTM:
- Doppletes Tracking
Bei einer falschen Konfiguration, kann es zu doppeltem Tracking von einzelnen Events kommen (Duplicate Content). - Technisches Verständnis erforderlich
Für die Integration oder Bearbeitung des Tracking Setups ist ein technisches Verständnis erforderlich.
Shopify Web Pixel — Vor- und Nachteile
Vorteile Shopify Web Pixel
- Einfache Integration
Bei der Nutzung des Shopify Web Pixels ist für die Integration und das Senden der Tracking Events kein Eingriff in den Shopify Theme Code mehr nötig. Das sorgt für mehr Sicherheit, eine bessere Übersicht und Wartbarkeit. - Checkout tracken auch ohne Shopify Plus Abo
Durch das neue Shopify Web Pixel kannst du auch den Checkout-Prozess (selbst ohne Shopify Plus) sauber mit GTM ansteuern.
- Höherer Sicherheitsstandard
Da das Shopify Web Pixels in einer sog. isolierten Sandbox-Umgebung ausgeführt wird, ist dieses Pixel vor unautorisiertem Zugriff geschützt und deutlich weniger anfällig für Angriffe oder Manipulationen durch Drittanbieter-Skripte.
Nachteile Shopify Web Pixel
- Eingeschränkte Flexibilität
Nur bestimmte, von Shopify vorgegebene Ereignisse (z.B. page view, product view, purchase, etc) können gemessen werden. (für die meisten allerdings ausreichend) - Limitierter Datenzugriff
Diese sog. Sandbox-Umgebung verhindert es, auf alle Daten der Website zuzugreifen.
- Nutzung von GTM Debugger nicht möglich
Bei einer vollständigen Integration des GTM Scripts in das Web Pixel, lässt sich die Debug Funktion des GTM’s nicht mehr nutzen.
Fazit
Wenn du deinen Shopify-Shop professionell tracken willst (z. B. E-Commerce Daten, Marketing-Tags etc.), lohnt sich der Weg über GTM. Der Web Pixel von Shopify ermöglicht dir dabei eine einfachere und sichere Integration.
Hinweis
Es sollte für die Integration unbedingt auf professionelle Hilfe mit technischem Verständnis zurückgegriffen werden. Schon kleinste Fehler bei der Integration können zu fehlerhaften Daten führen.
Google Tag Manager und Shopify Web Pixel einrichten
Die Einrichtung des Google Tag Managers in Kombination mit dem Shopify Web Pixel ist der entscheidende Schritt, um dein Tracking sauber, datenschutzkonform und zukunftssicher aufzusetzen – hier erfährst du, wie du beide Systeme richtig miteinander verbindest.
Google Tag Manager einrichten
Damit der GTM in Shopify wirklich zuverlässig funktioniert, gibt es im Grunde drei sinnvolle Ansätze:
- Verwendung externer Tools oder Drittanbieter-Integrationen, die die technische Einrichtung übernehmen und zusätzliche Datenanreicherung oder Automatisierung bieten.
Integration: Einfach, Lösung: Ausreichend
- Komplette Integration über die Shopify Customer Events (Web Pixel) — die moderne und offizielle Methode, die den GTM sauber in die Shopify-Datenstruktur einbindet.
Integration: Mittel, Lösung: Sehr gut
- Hybrid-Variante — Nutzung der Customer Events für den Datenfluss (dataLayer) kombiniert mit einer klassischen GTM-Einbindung im Shop-Frontend. So erhältst du sowohl volle Kontrolle über Events als auch eine flexible Verwaltung deiner Tags.
Integration: Schwer, Lösung: Ideal
Welche Variante du wählst, hängt von deinem technischen Know-how und deinen Tracking-Zielen ab – entscheidend ist jedoch, dass der GTM nicht nur sichtbar eingebunden, sondern auch funktional in den Datenfluss von Shopify integriert wird.
Empfehlung
Wenn du keine technischen Kenntnisse hast und einfach nur eine funktionierende Tracking-Verbindung brauchst, nutze am besten Shopify-Apps. Für eine saubere und stabile Lösung ist jedoch die vollständige Integration über das Shopify Custom Pixel zu empfehlen. Die optimale Variante stellt der hybride Ansatz dar, der Flexibilität und Präzision kombiniert. Ohne Apps sind allerdings technisches Verständnis und Entwicklerwissen unerlässlich. Du benötigst Unterstützung? Melde dich gerne und wir helfen dir.
Google Tag Manager - Konto erstellen und Container einrichten
Für die Einrichtung des Google Tag Managers (GTM) benötigst du zunächst ein Google-Konto. Sobald dieses erstellt ist, kannst du dein eigenes Tag-Manager-Konto anlegen. Anschließend kannst du die Grundkonfiguration deines Kontos vornehmen (siehe Abb. 2).
Abb. 2: Google Tag Manager Konto erstellen
Im nächsten Schritt vergibst du einen Namen für deinen Account (siehe Abb. 3). Dieser kann frei gewählt werden und dient ausschließlich deiner eigenen Orientierung, damit du später leicht erkennst, in welchem Konto du gerade arbeitest. In diesem Beispiel habe ich den Account „Seamless Convert“ genannt. Als nächstes wählst du noch das Land aus.
Abb. 3: Google Tag Manager Account anlegen
Anschließend wählst du einen Container-Namen aus – auch dieser ist frei wählbar. Ein Container ist im Grunde der Bereich, in dem alle deine Tracking-Tags verwaltet werden. Es kann vorkommen, dass du mehrere Container benötigst – zum Beispiel, wenn du sowohl eine Website als auch eine App betreibst und beide getrennt tracken möchtest. Im nächsten Schritt legst du fest, wo der Container eingesetzt werden soll. Da wir den Google Tag Manager mit einem Shopify-Shop verbinden, wählst du hier die Option „Web“. Zum Abschluss klickst du auf „Create“, akzeptierst die Nutzungsbedingungen und Datenschutzrichtlinien von Google. (siehe Abb. 4)
Abb. 4: Google Tag Manager – Container anlegen
Herzlichen Glückwunsch!
Dein Google Tag Manager-Account ist jetzt erfolgreich eingerichtet und einsatzbereit. Direkt im Anschluss erscheint ein Pop-up-Fenster, in dem dir das benötigte Code-Snippet für die Integration angezeigt und kurz erläutert wird. (siehe Abb. 5)
Abb. 5: Google Tag Manager Grundeinrichtung abgeschlossen – Pop-up mit weiteren Instruktionen
Deine Tracking-Daten stimmen nicht ganz?
Ich überprüfe dein aktuelles Setup und richte den Google Tag Manager in Shopify so ein, dass deine Daten vollständig und korrekt erfasst werden.
Marc – Seamless Convert
Gründer
Integration in Shopify
Bestehende Integrationen entfernen
Bevor du mit der Einbindung über das Shopify Web Pixel startest, ist es entscheidend, alle bestehenden Tracking-Integrationen zu entfernen. So stellst du sicher, dass keine Ereignisse doppelt erfasst werden und dein Tracking später sauber und verlässlich funktioniert.
Entfernung im Theme Code
Stelle sicher, dass sich kein Google Tag Manager-Code mehr direkt in deinem Theme-Code befindet. Öffne dazu den Shopify Code Editor – Gehe im Shopify-Admin Menü zu „Onlineshop“ → „Themes“, klicke anschließend auf die drei Punkte neben dem Button „Anpassen“ und wähle „Code bearbeiten“, um den Editor zu öffnen. (siehe Abb. 6)
Vorsicht!
Änderungen im Code sollten nur vorgenommen werden, wenn du dich damit auskennst, da Fehler unmittelbare Auswirkungen auf deinen gesamten Shop haben können.
Abb. 6: Shopify — Code Editor öffnen
Suche im Code-Editor nach der Datei theme.liquid, die sich in der Regel im Bereich Layout befindet. Öffne die Datei und nutze die Suchfunktion deines Browsers (Cmd + F auf Mac oder Strg + F auf Windows), um nach dem Begriff GTM zu suchen. Falls du dort ein Google Tag Manager-Snippet findest, entferne es vollständig, um Überschneidungen und doppelte Datenerfassungen zu vermeiden. (siehe Abb. 7)
Abb. 7: Shopify — mögliche Google Tag Manager Tags aus dem Theme Code entfernen
Google Channel deaktivieren
Der Grund für die Deaktivierung des Google Sales Channels ist, dass sonst Kundenereignisse über mehrere Wege gleichzeitig erfasst und dadurch doppelt gezählt werden könnten. Öffne dazu den Sales-Kanal Google & YouTube, navigiere zu den Settings und suche dort nach deiner Google Analytics Property. Klicke anschließend auf Disconnect, um die Verbindung zu trennen und eine saubere Datenerfassung sicherzustellen. (siehe Abb. 8)
Abb. 8: Shopify — Google Channel deaktivieren
Integration in Shopify Web Pixel
Um dein Google Tag Manager mit Shopify zu verbinden musst du das Web Pixel im Tracking-Manager öffnen. Achte darauf, dass du über die notwendigen Berechtigungen verfügst – idealerweise solltest du über Administratorrechte verfügen. Als erstes öffnest du in deinem Shopify-Account die Einstellungen. (siehe Abb. 9)
Abb. 9: Shopify — Schritt 1 den GTM im Tracking Pixel zu integrieren
Klicke anschließend im Menü auf den Bereich „Kundenereignisse“. Es öffnet sich ein Bereich, in dem du auswählen kannst, wie du deine Pixel verwalten möchtest. Wähle hier die Option „Benutzerdefiniertes Pixel hinzufügen“, um ein eigenes Tracking-Pixel – in unserem Fall für den Google Tag Manager – anzulegen. (siehe Abb. 10)
Abb. 10: Shopify — Schritt 2 den GTM im Tracking Pixel zu integrieren
Nun öffnet sich ein Pop-up-Fenster, in dem du deinem neuen Pixel einen beliebigen Namen geben kannst – wähle am besten eine Bezeichnung, die dir später hilft, den Zweck des Pixels leicht zu erkennen. Anschließend bestätigst du den Vorgang mit einem Klick auf „Pixel hinzufügen“. (siehe Abb. 11)
Abb. 11: Shopify — Tracking Pixel benennen und erstellen
Im nächsten Schritt öffnet sich ein Fenster, in dem du zunächst die Datenschutzeinstellungen für dein Pixel festlegen kannst. Im darunterliegenden Bereich „Code“ fügst du anschließend den Tracking-Code deines Google Tag Managers ein, um die Verbindung zwischen Shopify und dem GTM herzustellen. (siehe Abb. 12)
Abb. 12: Shopify — Aufbau des Shopify Custom Pixels
Lege in diesem Schritt die erforderlichen Datenschutzeinstellungen fest. Wenn du einen externen Cookie-Consent-Manager verwendest, wähle bei der Einwilligung die Option „Nicht erforderlich“ und setze den Punkt „Datenverkauf“ auf „Erfasste Daten gelten nicht als Datenverkauf“. So stellst du sicher, dass dein Setup korrekt mit deinem bestehenden Consent-Tool zusammenarbeitet. (siehe Abb. 13)
Abb. 13: Shopify — Tracking Pixel Datenschutzeinstellungen
Wechsle nun zurück in den Google Tag Manager und kopiere das Code-Snippet, das für den <head> Bereich deiner Website vorgesehen ist. Füge diesen Code anschließend in das dafür vorgesehene Code-Feld des benutzerdefinierten Pixels in Shopify ein, um die Verbindung korrekt herzustellen. Achte darauf, dass du nur den Code einfügst, welcher sich innerhalb der <script> Tags befindet. (siehe Abb. 14 und Abb. 15)
Abb. 14: Google Tag Manager — Code Snippet für <head> kopieren
Nachdem du das Code-Snippet eingefügt hast, speichere deine Änderungen, um die Integration dauerhaft zu übernehmen.
Abb. 15: Shopify — Codesnippet aus Google Tag Manager in Shopify Web Pixel einfügen
Klicke anschließend auf „Verbinden“, um den Google Tag Manager endgültig mit dem Shopify Pixel zu verknüpfen. (siehe Abb. 16)
Abb. 16: Shopify Tracking-Pixel verbinden
Beachte jedoch:
An diesem Punkt besteht zwar die technische Verbindung zum GTM, es werden jedoch noch keine Ereignisse (Events) an den Tag Manager übermittelt.
Du willst deinen Shopify-Shop endlich richtig messen?
Ich verbinde deinen Google Tag Manager mit dem Shopify Web Pixel, damit du Conversions, Events und Nutzerverhalten präzise tracken kannst – ohne Code-Chaos.
Marc – Seamless Convert
Gründer
Shopify Customer Events
Damit nun Customer Events von deinem Shopify-Shop an den Google Tag Manager (GTM) übermittelt werden können, musst du innerhalb der Shopify Pixel-Sandbox Kundenereignisse abonnieren. Diese Ereignisse – etwa Seitenaufrufe, Warenkorb-Aktionen oder Käufe – werden anschließend über das sogenannte dataLayer-Objekt an den GTM weitergegeben (siehe: Was ist ein DataLayer?).
Shopify bietet bereits eine Reihe vordefinierter Standard-Ereignisse, die du direkt nutzen kannst. Welche Standard-Events das sind, findest du auf folgender Seite: Shopify Standard Events
Wenn du jedoch zusätzliche oder speziell angepasste Aktionen erfassen möchtest, lassen sich auch eigene Ereignisse mithilfe von Liquid-Vorlagendateien erstellen und an den dataLayer senden. Im folgenden Beispiel wird gezeigt, wie das Standard-Ereignis product_viewed abonniert wird (siehe Code 1). Dieses wird jedes Mal ausgelöst, wenn ein Besucher ein Produkt aufruft – und automatisch an den dataLayer übermittelt.
analytics.subscribe("product_viewed", (event) => {
window.dataLayer.push({
event: "product_viewed",
product_title: event.data?.productVariant?.title,
});
});Code 1: Beispiel des Shopify Standard-Events „product_viewed“
Vorsicht!
Das von Shopify bereitgestellte Code-Snippet dient lediglich als Beispiel und zeigt die allgemeine Funktionsweise der Integration. Für die korrekte Einbindung des Google Tag Managers (GTM) ist jedoch eine angepasste Implementierung erforderlich.
Variablen aus Event-Daten richtig auslesen
Die Informationen, die du für deine Variablen benötigst, stammen aus den sogenannten Event-Daten. Diese enthalten alle relevanten Informationen, die Shopify bei einem Ereignis bereitstellt – etwa Produktdetails, Preise oder Aktionen des Nutzers. Damit der Google Tag Manager diese Daten korrekt verarbeiten kann, müssen sie über den richtigen Pfad der jeweiligen Variable zugeordnet werden. Im folgenden Beispiel wird gezeigt, wie du den Produkttitel aus den Event-Daten abrufst: event.data?.productVariant?.title (siehe Code 1)
Was ist ein DataLayer?
Der DataLayer ist – einfach gesagt – eine Datensammelstelle zwischen deiner Website und deinen Tracking-Tools wie dem Google Tag Manager. Du kannst ihn dir wie eine digitale Zwischenablage vorstellen: Immer wenn auf deiner Website etwas passiert – z. B. jemand legt ein Produkt in den Warenkorb oder schließt einen Kauf ab – werden diese Informationen im DataLayer gespeichert. Der Google Tag Manager kann sich diese Daten dann holen und an Tools wie Google Analytics oder Meta Ads weitergeben. So stellst du sicher, dass genau die richtigen Informationen an die richtigen Systeme gesendet werden – automatisch, strukturiert und ohne jeden einzelnen Code manuell anpassen zu müssen.
Shopify Standard-Events richtig einbinden: So versteht der Google Tag Manager deine Daten
Im nächsten Schritt müssen die gewünschten Standard-Events mit dem entsprechenden Code abonniert werden. Dabei ist besonders wichtig, dass der Aufbau und die Benennung der Variablen exakt stimmen. Die Ereignisparameter im Google Tag Manager müssen den vorgegebenen Namenskonventionen entsprechen – nur so können die dataLayer-Ereignisse korrekt vom GTM erkannt und verarbeitet werden. In Tab. 1 siehst du, wie die jeweiligen Events in der Shopify-Dokumentation definiert sind (linke Spalte) und welche Anpassungen erforderlich sind, damit sie korrekt an den Google Tag Manager (GTM) übertragen werden können (rechte Spalte).
Tab. 1: Shopify-Events und Google Tag Manager Events im Vergleich
Das page_view-Event wird im Google Tag Manager (GTM) standardmäßig automatisch über das GA4-Konfigurationstag an Google Analytics 4 gesendet. Daher findet man dazu in der Google-Dokumentation keine gesonderten Vorgaben oder Strukturen.
Wichtiger Hinweis!
Bei der Integration über das Shopify Web Pixel ist jedoch ein wichtiger Punkt zu beachten: Im GA4-Konfigurationstag muss der Parameter send_page_view auf false gesetzt werden. Anschließend sollte ein manuelles page_view-Event (bestehend aus eigenem Tag und Trigger) erstellt und an GA4 übermittelt werden. Nur so stellst du sicher, dass Seitenaufrufe korrekt und ohne doppelte Erfassung getrackt werden.
Shopify vs. Google Tag Manager: So unterscheiden sich die Event-Strukturen
In der offiziellen Shopify-Dokumentation werden die Standard-Events so beschrieben, wie sie aus Shopify-Sicht optimal implementiert werden sollten. Diese Struktur entspricht jedoch nicht vollständig den Anforderungen des Google Tag Managers (GTM). Daher ist bei der Integration besondere Sorgfalt geboten, um sicherzustellen, dass die Ereignisse korrekt erkannt und verarbeitet werden.
Im folgenden Beispiel siehst du den Unterschied zwischen beiden Ansätzen für ein Event, das ausgelöst wird, wenn eine Produktseite aufgerufen wird – bei Shopify heißt es „product_viewed“, im Google Tag Manager dagegen „item_view“. Das erste Codebeispiel zeigt die Shopify-Variante (siehe Code 2), das zweite die korrekte Umsetzung für den Google Tag Manager (siehe Code 3).
Shopify Definition für das Event "product_viewed"
analytics.subscribe("product_viewed", (event) => {
window.dataLayer.push({
event: "product_viewed",
timestamp: event.timestamp,
id: event.id,
client_id: event.clientId,
url: event.context.document.location.href,
product_id: event.data?.productVariant?.product?.id,
product_title: event.data?.productVariant?.title,
product_sku: event.data?.productVariant?.sku,
});
});Code 2: Shopify Defintion des Standard-Events „product_viewed“
Erforderliche GTM-Struktur für das Event "product_viewed"
Man erkennt schnell, dass sich bei Shopify und dem Google Tag Manager nicht nur die Benennung der Events und Variablen, sondern auch deren Struktur unterscheidet. Genau dieser Aufbau ist entscheidend dafür, dass der GTM die Ereignisse korrekt erkennt und die relevanten Daten fehlerfrei auslesen und verarbeiten kann.
analytics.subscribe("product_viewed", (event) => {
window.dataLayer.push({
'event': "view_item",
'ecommerce': {
'currency': event.data?.productVariant?.price?.currencyCode,
'value': event.data?.productVariant?.price?.amount,
'items': [{
'item_id': event.data?.productVariant?.sku,
'item_name': event.data?.productVariant?.product?.title,
'item_variant': event.data?.productVariant?.title,
'item_brand': event.data?.productVariant?.product?.vendor,
'item_category': event.data?.productVariant?.product?.type,
'price': event.data?.productVariant?.price?.amount,
'quantity': 1
}]
}
});
});Code 3: Für den GTM erforderliche Struktur des Standard-Events „product_viewed“
Shopify-Pixel-Code – kostenlos anfordern
Vernetze dich mit mir auf LinkedIn und schreib mir eine kurze Nachricht mit dem Stichwort Shopify Pixel. Ich sende dir den vollständigen Code und zeige dir, wie du ihn richtig einbindest.
Nur 1:1-Nachricht. Kein Spam.
Integrierte Events testen / debuggen
Zum Testen deiner integrierten Events stehen dir mehrere Möglichkeiten zur Verfügung. Der klassische Debug-Modus des Google Tag Managers funktioniert in diesem Fall jedoch nicht, da sich der Code innerhalb der Shopify Sandbox befindet – einer geschützten Umgebung, die vom GTM nicht direkt erkannt wird. Im Folgenden findest du alternative Methoden, mit denen du deine Events trotzdem zuverlässig überprüfen kannst.
Shopify Debug Mode
Um deine eingebundenen Events zu testen, öffne das benutzerdefinierte Pixel, in dem du die Ereignisse implementiert hast. Klicke dort oben auf den Button „Testen“. (siehe Abb. 17)
Abb. 17: Customer Events mit Shopify Debug Mode testen
Daraufhin öffnet sich ein neues Fenster mit deinem Shop. In dem sog. Pixel Helper kannst du sehen, ob der Google Tag Manager erfolgreich geladen wurde und ob die jeweiligen Events korrekt ausgelöst werden. So überprüfst du schnell und unkompliziert, ob deine Implementierung wie vorgesehen funktioniert. (siehe Abb. 18)
Abb. 18: Shopify Pixel Helper zeigt Status von Google Tag Manager und integrierten Events an
Entwickler Konsole im Browser
Eine weitere, besonders unter Entwicklern verbreitete Methode zum Testen von Events ist die Überprüfung über den DataLayer (siehe „Was ist ein DataLayer“). Dazu öffnest du die Entwicklertools deines Browsers – einfach mit einem Rechtsklick auf deinen Online-Shop und der Auswahl „Untersuchen“. Wechsle anschließend in den Tab „Console“ und gib dort den Befehl dataLayer ein. Daraufhin werden dir alle im DataLayer gespeicherten Informationen angezeigt – ideal, um zu prüfen, welche Events tatsächlich ausgelöst und welche Daten übergeben wurden.
Wichtiger Hinweis!
Da sich der DataLayer innerhalb der Shopify Sandbox befindet, musst du in der Browser-Konsole zunächst in die richtige Umgebung wechseln, bevor du auf ihn zugreifen kannst. Öffne dazu in der Konsole das Dropdown-Menü (siehe Abb. 19) und ändere die Einstellung von „Top“ auf „web-pixel-sandbox-CUSTOM-...“. Achte darauf, die Sandbox auszuwählen, deren Name nach diesem Präfix eine individuelle Nummer oder ID enthält – nur dort ist dein DataLayer aktiv.
Abb. 19: DataLayer in Entwickler Konsole des Browsers in zugehöriger Shopify Sandbox prüfen
Sobald du zur richtigen Sandbox gewechselt hast, gib einfach dataLayer in die Konsole ein. Anschließend werden dir alle Inhalte und Events deines DataLayers angezeigt, sodass du prüfen kannst, ob die Implementierung korrekt funktioniert. (siehe Abb. 20)
Abb. 20: DataLayer Event in Entwickler Konsole des Browsers prüfen
Browser Extension - dataLayer Checker Plus
Da die Überprüfung über die Browser-Konsole für Einsteiger etwas technisch sein kann, gibt es eine deutlich einfachere Methode: die Nutzung der Browser-Erweiterung „DataLayer Checker Plus“. Nach der Installation aktivierst du in den Einstellungen der Erweiterung die Option „Shopify Custom Pixel DataLayer Checker“ (siehe Abb. 21). Anschließend musst du nur noch die Extension im Browser öffnen, und schon werden dir alle aktuell im DataLayer erfassten Events übersichtlich angezeigt – ganz ohne manuelle Eingaben in der Konsole.
Unter folgendem Link kannst du die Erweiterung installieren: DataLayer Checker Plus
Abb. 21: Einstellung der Browser Extension „DataLayer Checker Plus“
In der linken Spalte der Erweiterung werden dir alle erfassten Events übersichtlich aufgelistet. Wenn du eines dieser Ereignisse auswählst – zum Beispiel „page_view“ –, erscheinen auf der rechten Seite die zugehörigen Details, einschließlich aller implementierten Variablen und deren Werte. So kannst du genau nachvollziehen, welche Daten im jeweiligen Event übergeben werden. (siehe Abb. 22)
Abb. 22: Funktionsweise der Browser Extension „DataLayer Checker Plus“
Vertraust du deinen Daten?
Ich überprüfe dein Google Tag Manager Setup in Shopify, finde fehlerhafte Events und helfe dir, dein Tracking sauber und zuverlässig aufzusetzen.
Marc – Seamless Convert
Gründer
Fazit
Die Integration des Google Tag Managers (GTM) über das Shopify Custom Pixel verbindet beide Systeme reibungslos und bildet die Grundlage für ein präzises, zukunftssicheres Tracking. Damit kannst du deine Google Analytics-Daten erweitern und durch Event-Tracking besser verstehen, wie Nutzer mit deinem Shop interagieren.
Über den GTM lassen sich Tools wie Hotjar, Meta Pixel oder Pinterest Tag ganz ohne zusätzlichen Code einbinden und verwalten. So bleibt dein Setup übersichtlich, zentral steuerbar und du vermeidest unnötige Eingriffe in den Website-Code.
Ob du dich für eine Hybrid oder Vollintegration mit dem Shopify Pixel entscheidest, hängt von deinen Zielen und deinem technischen Wissen ab. Beide Varianten sind sinnvoll – je nachdem, wie tief du dein Tracking strukturieren möchtest.
Abschließend ist wichtig zu betonen, dass diese Integration technisches Verständnis erfordert. Ohne eine saubere Umsetzung kann es schnell zu doppelten Event-Erfassungen oder fehlerhaften Datengrundlagen kommen – was wiederum dazu führen kann, dass Marketingbudgets falsch interpretiert oder ineffektiv eingesetzt werden. Eine sorgfältige Implementierung ist daher entscheidend, um verlässliche Daten und fundierte Entscheidungen sicherzustellen.
FAQs zu E-Commerce Tracking
Brauche ich technisches Wissen für die Integration?
Ein gewisses technisches Verständnis ist definitiv notwendig, um den Google Tag Manager mit dem Shopify Web Pixel korrekt einzurichten. Ohne Erfahrung kannst du Apps nutzen, doch für ein sauberes Shopify Tracking Setup empfiehlt sich eine manuelle Integration oder Unterstützung durch Experten.
Bietet Seamless Convert die technische Einrichtung des Google Tag Managers in Shopify an?
Ja, wir übernehmen auf Wunsch die komplette technische Integration des Google Tag Managers in Shopify – inklusive Einrichtung des Shopify Web Pixels, Implementierung relevanter Events (z. B. page_view, add_to_cart, purchase) sowie Einbindung von Google Analytics 4 oder weiteren Tools. So erhältst du ein sauberes, datenschutzkonformes und professionell konfiguriertes Tracking-Setup, das von Anfang an zuverlässig funktioniert.
Funktioniert der Google Tag Manager auch ohne Shopify Plus?
Ja, dank des Shopify Web Pixels kannst du den Google Tag Manager jetzt auch ohne Shopify Plus verwenden. So lässt sich dein gesamtes Shopify Tracking zentral und flexibel steuern.
Welche Vorteile bietet die Integration?
Durch die Verbindung von Google Tag Manager und Shopify Web Pixel erhältst du ein zentrales, übersichtliches Tracking-System. Du kannst Standard-Events wie page_view oder purchase erfassen und Drittanbieter-Tools wie Hotjar oder Meta Pixel einfach anbinden.
Was passiert, wenn der GTM auch im Theme-Code eingebunden ist?
Achte darauf, dass der GTM-Code nicht doppelt integriert ist. Falls das im Theme-Code und im Shopify Tracking Pixel der Fall ist, werden Events mehrfach gezählt. Entferne alte Einbindungen im Theme Code, bevor du den Google Tag Manager mit dem Shopify Web Pixel verbindest.
Welche Events kann ich tracken?
Mit dem Google Tag Manager in Shopify kannst du Standard-Events wie add_to_cart, begin_checkout oder purchase sowie eigene Events über den dataLayer erfassen und an Tools wie Google Analytics weitergeben. Eine Liste der von Shopify angebotenen Standard-Events findest hier: Standard-Events
Wie kann ich die Integration testen?
Da der GTM-Code in der Shopify Web Pixel Sandbox läuft, funktioniert der normale Debug-Modus nicht. Teste deine Events direkt im Shopify Web Pixel oder nutze die Browser-Erweiterung „dataLayer Checker Plus“.
Ist die Nutzung datenschutzkonform?
Ja – mit einem Consent-Management-Tool und den richtigen Datenschutzeinstellungen im Shopify Web Pixel bleibt dein Tracking DSGVO-konform. Der GTM kann Tags nur nach Nutzerzustimmung auslösen.
Vollständige oder hybride Integration im Shopify Web Pixel – welche ist besser?
Die vollständige Integration über das Shopify Web Pixel ist einfacher, sauberer und zentral gepflegt. Die hybride Lösung mit zusätzlichem Theme-Code bietet mehr Flexibilität, erfordert jedoch technisches Know-how und ist pflegeintensiver.
Autor
Marc ist der Gründer von Seamless Convert. Er teilt in diesen Beiträgen sein Wissen jahrelanger Expertise im Bereich der datengetriebenen UX-Optimierung.
Na, neugierig geworden?
Entdecke weitere spannende Themen und praxisnahe Insights in den anderen Beiträgen.
