So fügen Sie benutzerdefinierte Events in Shopify hinzu (2026)

Zuletzt aktualisiert
Von Experten geprüft
5 Min. Lesezeit
Jacques Blom
Jacques Blom
CTO bei Fudge.

Wichtigste Erkenntnisse

  • Die Customer Events API von Shopify (Einstellungen → Kundenereignisse → Benutzerdefiniertes Pixel hinzufügen) ist der richtige Ort für das Tracking benutzerdefinierter Events.
  • Zu den Standard-Events von Shopify gehören page_viewed, product_viewed, product_added_to_cart und checkout_completed.
  • Benutzerdefinierte Pixel laufen in einer Sandbox-Umgebung mit Zugriff auf alle Checkout-Events – etwas, das theme.liquid-Skripte nicht können.
  • Sie schreiben Standard-JavaScript im Editor für benutzerdefinierte Pixel – es ist keine Shopify-spezifische Syntax erforderlich.

Das Tracking benutzerdefinierter Events verrät Ihnen, was Shopper tatsächlich in Ihrem Store tun – nicht nur, welche Seiten sie besuchen, sondern auch, wann sie Produkte in den Warenkorb legen, den Checkout starten oder Ihre Danke-Seite erreichen. Mit der Customer Events API von Shopify lässt sich dies tracken, ohne im Theme-Code graben zu müssen.

Wie füge ich Events in Shopify hinzu?

Gehen Sie zu Einstellungen → Kundenereignisse → Benutzerdefiniertes Pixel hinzufügen. Dies öffnet einen JavaScript-Editor, in dem Sie Code schreiben, der auf die Standard-Events von Shopify hört und als Reaktion Ihren eigenen Tracking-Code ausführt.

Zum Messen der Ergebnisse siehe Add Tracking Scripts to Shopify.


Standard-Events von Shopify

Shopify stellt eine Reihe von Standard-Events entlang der Shopping Journey bereit. Dein Custom Pixel kann auf jedes dieser Events hören:

Page-Events:

Produkt-Events:

Checkout-Events:

Diese Events enthalten kontextbezogene Daten — das aufgerufene Produkt, der Warenkorbwert zu Beginn des Checkouts, der Gesamtbetrag der Bestellung beim Abschluss.

Passend dazu: So passen Sie die checkout.liquid in Shopify Plus an (2026).


Ein benutzerdefiniertes Pixel schreiben

Hier ist ein einfaches Beispiel, das ein GA4-Event sendet, wenn ein Produkt in den Warenkorb gelegt wird:

analytics.subscribe('product_added_to_cart', (event) => {
  const cartLine = event.data.cartLine;

  // Send to GA4 via dataLayer (if GTM is installed)
  window.dataLayer = window.dataLayer || [];
  window.dataLayer.push({
    event: 'add_to_cart',
    ecommerce: {
      currency: cartLine.merchandise.product.vendor,
      items: [{
        item_id: cartLine.merchandise.sku,
        item_name: cartLine.merchandise.product.title,
        price: cartLine.cost.totalAmount.amount,
        quantity: cartLine.quantity
      }]
    }
  });
});

Und für ein Meta-Pixel Purchase-Event beim Checkout-Abschluss:

Passend dazu: So fügen Sie den Google Tag Manager zu Shopify hinzu (2026).

Passend dazu: So fügen Sie benutzerdefiniertes JavaScript in Shopify hinzu (2026).

analytics.subscribe('checkout_completed', (event) => {
  const order = event.data.checkout;

  fbq('track', 'Purchase', {
    value: order.totalPrice.amount,
    currency: order.currencyCode,
    content_ids: order.lineItems.map(item => item.variant.sku),
    content_type: 'product'
  });
});

Wichtig: Die Funktion analytics.subscribe() wird von Shopifys Sandbox-Umgebung bereitgestellt. Du musst sie nicht importieren — sie ist automatisch in allen Custom Pixeln verfügbar.


Schritt für Schritt ein benutzerdefiniertes Pixel einrichten

Schritt 1 - Gehe zu Einstellungen → Kunden-Events

Schritt 2 - Klicke auf Benutzerdefiniertes Pixel hinzufügen

Schritt 3 - Gib ihm einen Namen (z. B. „GA4 Custom Events“ oder „Meta Purchase Event“)

Schritt 4 - Schreibe im Bereich „Code“ dein JavaScript mithilfe von analytics.subscribe()

Schritt 5 - Lege die Berechtigungsstufe für den Datenschutz fest:

Wähle für das Purchase-Tracking „Marketing“, wenn du Daten an Werbeplattformen sendest, oder „Statistik“ für GA4.

Um Ergebnisse zu messen, siehe add tracking scripts to shopify.

Schritt 6 - Klicke auf Speichern und dann auf Verbinden


Testen Ihres benutzerdefinierten Pixels

Der integrierte Debugger von Shopify. Im Editor für Kundenereignisse gibt es einen Live-Event-Feed, der ausgelöste Events in Echtzeit anzeigt. Öffnen Sie Ihren Storefront in einem anderen Tab und surfen Sie ein wenig herum – Sie sollten sofort page_viewed-Events sehen.

Browser-Konsole. Da benutzerdefinierte Pixel in einem Sandboxed-Iframe laufen, können Sie deren console.log-Ausgaben nicht direkt sehen. Nutzen Sie stattdessen das Debugger-Panel von Shopify.

GA4 DebugView. Gehen Sie in Ihrer GA4-Property auf Konfigurieren → DebugView. Lösen Sie Events in Ihrem Storefront aus und beobachten Sie, wie sie in Echtzeit erscheinen.

Fügen Sie Conversion-Tracking-Elemente zu Ihrem Shopify-Store hinzu.
Try Fudge for Free

Benutzerdefinierte Events vs. Standard-App-Integrationen

Shopify hat vorgefertigte Integrationen für Google Analytics, Google Ads, Meta, TikTok, Snapchat und andere im Bereich Kundenereignisse (Customer Events). Diese übernehmen das Standard-Purchase-Tracking automatisch.

Verwende benutzerdefinierte Pixel, wenn:

Für die meisten Shops decken die Standard-Integrationen 80 % des Bedarfs ab. Benutzerdefinierte Pixel füllen die Lücken.


FAQ

Wo werden benutzerdefinierte Pixel im Storefront ausgeführt?

Innerhalb eines Sandbox-iframes, das von Shopify eingefügt wird – deshalb kannst du nicht direkt auf window oder das Page-DOM zugreifen. Der Vorteil ist die Zuverlässigkeit: Pixel werden weiterhin auf den Checkout-Seiten abgefeuert, wo Händler traditionell oft den Überblick verlieren, und sie können durch Theme-Updates nicht kaputt gemacht werden.

Kann ich jQuery oder andere Bibliotheken in einem benutzerdefinierten Pixel verwenden?

Nein. Benutzerdefinierte Pixel laufen in einer Sandbox-Umgebung mit begrenzten globalen Variablen – nur Vanilla-JavaScript ist möglich. Wenn du eine Bibliothek brauchst, musst du sie entweder über ein CDN in den Pixel-Code einbinden oder die Integration ohne Bibliothek bauen. Das meiste Tracking kann mit fetch und Standard-Browser-APIs erledigt werden.

Funktionieren benutzerdefinierte Pixel für Shopify-Checkout-Events auch in Basic-Plänen?

Ja. Die Customer Events API ist in allen Shopify-Plänen verfügbar, auch im Basic-Plan. Das ist wichtig, da vor 2023 das serverseitige Checkout-Tracking größtenteils nur für Shopify Plus verfügbar war. Benutzerdefinierte Pixel machen das Tracking von Checkout-Events für jeden Plan zugänglich.

Wie sende ich Checkout-Events aus einem benutzerdefinierten Pixel an den Google Tag Manager?

Pushe aus dem Pixel heraus in den dataLayer – aber da das Pixel in einer Sandbox läuft, musst du in den dataLayer des übergeordneten Fensters pushen, indem du parent.window.dataLayer.push() verwendest. Die meisten Shops überspringen das und nutzen stattdessen den nativen GTM-Connector von Shopify. Sie fügen nur dann ein benutzerdefiniertes Pixel hinzu, wenn der Connector bestimmte Events nicht abdeckt.

Warum feuert mein benutzerdefiniertes Pixel nicht auf der Dankesseite?

Zwei häufige Ursachen: (1) Die Datenschutzberechtigungen sind strenger eingestellt als die Zustimmung des Besuchers (z. B. ist "Marketing" erforderlich, aber der Besucher hat Marketing abgelehnt), oder (2) das Pixel abonniert das falsche Event – checkout_completed wird auf der Dankesseite ausgelöst, nicht order_created (das serverseitig ausgelöst wird und nicht immer an Client-Pixel weitergegeben wird).

Jacques's signature
Füge deinem Shopify-Shop Conversion-optimierte Elemente hinzu, indem du sie einfach beschreibst.

You might also be interested in

So fügen Sie den Google Tag Manager zu Shopify hinzu (2026)
Installieren Sie Google Tag Manager in wenigen Minuten in Ihrem Shopify-Shop. Behandelt die exakte Platzierung der Skripte, Einschränkungen beim Checkout-Tracking und häufige Fehler.
So fügst du Tracking-Skripte zu Shopify hinzu (2026)
Erfahren Sie, wie Sie Tracking-Skripte zu Shopify hinzufügen — via Customer Events (Pixel-Manager), App Embeds oder theme.liquid. Inklusive Platzierung und Einschränkungen.
Conversion-Tracking in Shopify einrichten (2026)
Richte das Conversion-Tracking in Shopify für GA4, Google Ads und das Meta-Pixel ein. Deckt integrierte Analytics und die Customer Events API ab.