Hilfe
Einloggen

Testen von benutzerdefinierten Pixeln

Nachdem du ein benutzerdefiniertes Pixel erstellt hast, musst du es testen, um sicherzustellen, dass dein Pixel Daten korrekt sendet, wenn Ereignisse auf deiner Website auftreten.

Du kannst den Shopify Pixel Helper verwenden, um zu testen, ob deine Pixel-Ereignisse laden und ob du Shopify-Ereignisse ordnungsgemäß abonniert hast. Mit dem Shopify Pixel Helper kannst du dein benutzerdefiniertes Pixel in deinem Onlineshop testen, um die in Echtzeit empfangenen Ereignisse zusammen mit den Daten für diese Ereignisse anzuzeigen.

Wenn dein benutzerdefiniertes Pixel in eine Plattform eines Drittanbieters integriert ist, die über ein eigenes Pixel-Helfer-Tool verfügt, kannst du den Pixel-Helfer des Drittanbieters zusätzlich zum Shopify Pixel Helper verwenden, um zu testen, ob deine Pixel-Ereignisse von der Plattform des Drittanbieters verarbeitet und empfangen werden. Wenn du beispielsweise ein benutzerdefiniertes TikTok-Pixel in deinem Shop hinzufügst, kannst du sowohl den Shopify Pixel Helper als auch den TikTok Pixel Helper verwenden, um dein Pixel zu testen.

Du kannst den Shopify Pixel Helper in derselben Browser-Sitzung wie einen Pixel-Helfer eines Drittanbieters verwenden, um Ereignisse für beide Plattformen gleichzeitig zu testen.

Hier ist ein benutzerdefiniertes Pixel-Skript, das alle Standardereignisse an die Sandbox auslöst und die Ereignisdaten in der Konsole protokolliert. Die Standardereignisse sind im Shopify Pixel Helper sichtbar. Zusätzlich kannst du andere Sammelabonnements wie all_events, all_custom_events und all_dom_events abonnieren, um alles zu entdecken, was Webpixel bieten können. Weitere Informationen findest du in der Webpixel-API.

analytics.subscribe("all_standard_events", event => {
   console.log("Event data ", event?.data);
});

Auf dieser Seite

Sicherstellen, dass ein benutzerdefiniertes Pixel verbunden ist

Bevor du dein benutzerdefiniertes Pixel testest, stelle sicher, dass das benutzerdefinierte Pixel verbunden ist.

Schritte:

  1. Gehe in deinem Shopify-Adminbereich zu Einstellungen > Kundenereignisse.

  2. Vergewissere dich, dass neben dem Pixel, das du testen möchtest, in der Spalte Status der Status Verbunden angezeigt wird.

  3. Wenn das Pixel nicht verbunden ist, klicke auf ... und dann auf Verbinden.

Ein benutzerdefiniertes Pixel mit dem Shopify Pixel Helper testen

Nachdem du dich vergewissert hast, dass dein benutzerdefiniertes Pixel verbunden ist, kannst du den Shopify Pixel Helper verwenden, um zu testen, ob dein benutzerdefiniertes Pixel Daten sendet und die Daten deines Shops empfängt. Du kannst immer nur ein benutzerdefiniertes Pixel auf einmal testen.

Schritte:

  1. Gehe in deinem Shopify-Adminbereich zu Einstellungen > Kundenereignisse.

  2. Klicke auf das benutzerdefinierte Pixel, das du testen möchtest.

  3. Klicke auf Testen, um das benutzerdefinierte Pixel auf deiner Website zum Testen zu öffnen.

  4. Optional: Abhängig von den Einwilligungseinstellungen deines Shops und den Datenschutzeinstellungen für Kund:innen des benutzerdefinierten Pixels wird im Dialogfeld Pixel-Helfer möglicherweise Pixel wartet auf Zustimmung angezeigt. Führe einen der folgenden Schritte aus, um den Test fortzusetzen:

  5. Um zu sehen, welche Ereignisse geladen werden, besuche jede Seite, auf der du das Pixel testen möchtest, und überprüfe im Dialogfeld Pixel-Helfer im Abschnitt Empfangene Ereignisse, ob das Ereignis erfolgreich abonniert wurde und die Callback-Funktion erfolgreich war:

    • Gehe auf eine neue Seite, um das Ereignis page_viewed zu testen.
    • Klicke auf ein Produkt, um das Ereignis product_viewed zu testen.
    • Füge ein Produkt zu deinem Warenkorb hinzu, um das Ereignis product_added_to_cart zu testen.
    • Gehe zu deinem Checkout, um das Ereignis checkout_started zu testen.
    • Gib deine Versandinformationen beim Checkout ein, um zu testen, dass das Ereignis checkout_shipping_info_submitted das Ereignis checkout_started ersetzt.
    • Schließe den Checkout ab, um zu testen, dass das Ereignis checkout_completed das Ereignis checkout_shipping_info_submitted ersetzt. Erfahre mehr über das Aufgeben einer Testbestellung.

  6. Um die empfangenen Ereignisdaten anzuzeigen, klicke auf Maximieren, um das Dialogfeld des Pixel-Helfers zu erweitern.

Der Abschnitt „Empfangene Ereignisse“

Wenn du in Schritt 5 testest, welche Ereignisse geladen werden, wird einer der folgenden Status im Abschnitt Empfangene Ereignisse des Dialogfelds Pixel-Helfer angezeigt:

  • Ein grüner Punkt zeigt an, dass das Ereignis erfolgreich abonniert wurde und die Callback-Funktion erfolgreich war.
  • Ein roter Punkt zeigt an, dass das Ereignis erfolgreich abonniert wurde, aber die Callback-Funktion fehlgeschlagen ist. Erfahre, wie du Fehler bei deinem benutzerdefinierten Pixel beheben kannst.
  • Der Pixel-Helfer zeigt nicht abgefangene Fehler an, die auf der obersten Ebene oder in der Callback-Funktion auftreten. Fehler der obersten Ebene werden angezeigt, wenn der Pixel-Helfer geladen wird. Fehlermeldungen der Callback-Funktion werden angezeigt, wenn du klickst, um ein Ereignis mit einem roten Punkt zu erweitern.
  • Das folgende Codebeispiel enthält einen Callback-Fehler und einen Fehler auf oberster Ebene. Je nachdem, wo sich der Fehler auf oberster Ebene befindet, funktioniert das Pixel möglicherweise nur teilweise.
analytics.subscribe("all_standard_events", event => {
  console.log("Event data ", event?.data);
  throw new Error("callback error");
});

throw new Error("top level error")

Mehr über die Behebung von JavaScript-Fehlern erfährst du unter Fehlerbehebung bei JavaScript.

Fehlerbehebung für dein benutzerdefiniertes Pixel

Wenn dein Pixel beim Testen nicht geladen oder ausgelöst wird und du deine Ereignisdaten und deinen Pixel-Code bereits auf Fehler überprüft hast, probiere die folgenden Maßnahmen zur Fehlerbehebung aus.

Überprüfung deiner Datenschutzeinstellungen für Kunden

Wenn dein Pixel beim Testen nicht geladen oder ausgelöst wird, könnte es an den Datenschutzeinstellungen für Kunden liegen, die das Laden verhindern.

Gehe in deinem Shopify-Adminbereich zu Einstellungen > Datenschutz für Kund:innen, um nach Datenschutzeinstellungen für Kunden in deinem Shopify-Adminbereich zu suchen, die für deine Sitzung gelten könnten. Führe je nach deinen Datenschutzeinstellungen für Kunden die folgenden Schritte aus:

  • Wenn du Datenschutzeinstellungen für Kunden hast, die in deiner Region eine Einwilligung erfordern, stelle sicher, dass du deine Einwilligung über dein Cookie-Banner erteilt hast.
  • Wenn du keine Datenschutzeinstellungen für Kunden hast, die das Laden des Pixels blockieren, lösche die Cookies deines Browsers, um dein Cookie-Banner zurückzusetzen und deine Einwilligung zu erteilen.

Wenn du ein externes Tool zur Verwaltung der Einwilligung verwendest, wende dich für Support an den externen Anbieter.

Weitere Fehlerbehebung

Wenn immer noch unklar ist, ob dein benutzerdefiniertes Pixel ein Kundenereignis ordnungsgemäß abonniert hat, probiere die folgenden Maßnahmen zur Fehlerbehebung aus:

  • Lösche die Cookies deines Browsers.
  • Wenn du ein Standardereignis testest, sieh dir die Entwicklerdokumentation von Shopify zu den Beschreibungen von Standardereignissen an, um sicherzustellen, dass du die erforderlichen Schritte zum Auslösen des Ereignisses ausführst.

Testen mit externem Pixel-Helfer

Ein Pixel-SDK (Software Development Kit) enthält die Tools, mit denen dein Pixel Informationen über das Verhalten der Kundschaft erfasst. Du kannst den Pixel-Helfer deines externen Pixel-Anbieters verwenden, um die folgenden Verhaltensweisen deines Pixels zu testen und sicherzustellen, dass das Pixel-SDK wie erwartet funktioniert:

Testen, ob ein externes Pixel-SDK geladen wird

Die Schritte zur Überprüfung deines Netzwerk-Tabs hängen vom verwendeten Webbrowser ab. Um beispielsweise zu erfahren, wie du deinen Netzwerk-Tab in Google Chrome überprüfst, sieh dir die Dokumentation Netzwerkaktivität untersuchen von Chrome for Developers an.

Um zu testen, dass ein externes Pixel-SDK geladen wird, musst du zuerst den Code deines externen Anbieters für die SDK-URL abrufen, damit du ihn zu deinem Pixel-Code hinzufügen kannst. Wende dich für Support an deinen externen Pixel-Anbieter.

Schritte:

  1. Gehe in deinem Shopify-Adminbereich zu Einstellungen > Kundenereignisse.

  2. Klicke auf das benutzerdefinierte Pixel, das du testen möchtest.

  3. Gib im Abschnitt Code das vom externen Anbieter bereitgestellte Pixel-SDK am Ende deines Pixel-Codes ein.

  4. Klicke auf Speichern.

  5. Besuche deinen Onlineshop und überprüfe dann deinen Netzwerk-Tab, um sicherzustellen, dass die SDK-URL des externen Anbieters heruntergeladen wird.

  6. Optional: Wenn das externe Pixel-SDK nicht geladen wird, suche in der Sandbox nach JavaScript-Laufzeitfehlern. In Chrome kannst du beispielsweise einen bestimmten iFrame auswählen, um dessen Konsolenprotokolle zu überprüfen, und dann die Protokolle auf das spezifische Pixel eingrenzen, das du testest. Um mehr über die Überprüfung von JavaScript-Laufzeitfehlern in Chrome zu erfahren, sieh dir die Dokumentation JavaScript debuggen von Chrome an.

Wenn das externe Pixel-SDK beim Testen nicht geladen wird, wende dich für Support an deinen externen Pixel-Anbieter.

Weitere Tests für externe Pixel-SDKs

Um zu testen, ob ein externes Pixel-SDK initialisiert ist oder Ereignisse erfasst, sieh dir die Dokumentation deines externen Pixel-Anbieters an.

Um zu testen, ob ein Pixel-SDK Ereignisse erfasst, wirst du möglicherweise angewiesen, den Netzwerk-Tab deines Browsers zu überprüfen. Die Schritte zur Überprüfung deines Netzwerk-Tabs hängen vom verwendeten Webbrowser ab. Um beispielsweise zu erfahren, wie du deinen Netzwerk-Tab in Google Chrome überprüfst, sieh dir die Dokumentation Netzwerkaktivität untersuchen von Chrome for Developers an.