Wie richte ich Facebook Pixel mit dem Zonos-Legacy-Iframe-Checkout ein?

Fügen Sie den Standard-Meta-Pixel-Basiscode auf der Seite mit dem Checkout-Iframe hinzu, setzen Sie window.Zonos.facebookPixelId in Ihrem Checkout-customHTML, aktivieren Sie Facebook Pixel im Zonos-Dashboard und fügen Sie das Zonos analyticsRelayOnInit.js-Skript hinzu. Das Relay-Skript übernimmt die Cross-Iframe-Kommunikation und leitet Checkout-Ereignisse an Meta weiter.

Welche Facebook-Pixel-Ereignisse verfolgt Zonos Checkout?

Für jeden Funnel-Schritt sendet Zonos sowohl ein benutzerdefiniertes Ereignis (zonos-checkout-start, zonos-checkout-customer-info, zonos-checkout-shipping-info, zonos-checkout-payment-info, zonos-checkout-payment-fail, zonos-checkout-success, zonos-checkout-close) als auch das passende Meta-Standardereignis, sofern vorhanden: InitiateCheckout beim Checkout-Start, AddPaymentInfo bei Zahlungsinformationen und Purchase bei Bestellabschluss.

Kann ich Google Analytics und Facebook Pixel gleichzeitig nutzen?

Ja. Dasselbe analyticsRelayOnInit.js-Skript verarbeitet beide Anbieter in einem Handshake. Fügen Sie beide Basis-Tags auf Ihrer Seite hinzu, setzen Sie window.Zonos.googleAnalyticId und window.Zonos.facebookPixelId in customHTML und aktivieren Sie beide Anbieter im Zonos-Dashboard.

Wie debugge ich Facebook-Pixel-Ereignisse aus Zonos Checkout?

Fügen Sie den Query-Parameter zonosDebug=1 zur Seiten-URL hinzu und öffnen Sie die Entwicklerkonsole Ihres Browsers für detaillierte Logs des Relay-Handshakes und weitergeleiteter Ereignisse. Die Meta Pixel Helper Chrome-Erweiterung ist ebenfalls hilfreich.

Checkout•

StartseiteAPI-Referenz Checkout REST API Facebook Pixel

Facebook-Pixel für Iframe Checkout

Verfolgen Sie den gesamten Checkout-Funnel mit Meta (Facebook) Pixel bei einer iframe-basierten Legacy-Checkout-Integration.

Händler mit der Legacy-Checkout-Integration (Iframe auf iglobalstores.com) können Meta-Pixel-Ereignisse im gesamten Checkout-Funnel verfolgen. Zonos Checkout leitet Analyseereignisse automatisch vom Iframe an die übergeordnete Seite weiter – mit demselben leichtgewichtigen Relay-Skript wie für Google Analytics 4, sodass Ereignisse in Ihrem Meta Events Manager erscheinen, als stammten sie von Ihrer eigenen Website.

Für jeden Trichterschritt werden zwei Ereignisse ausgegeben:

Ein benutzerdefiniertes Ereignis mit dem Namen zonos-checkout-... (über fbq('trackCustom', ...)) für Full-Funnel-Custom-Audiences.
Das passende Meta-Standardereignis (über fbq('track', ...)) für die integrierte Optimierung, z. B. InitiateCheckout, AddPaymentInfo und Purchase.

Native Integrationen benötigen dieses Handbuch nicht. Wenn <zonos-checkout> direkt auf Ihrer Website rendert (kein Iframe), ruft Zonos die window.fbq-Funktion Ihrer Seite direkt auf – aktivieren Sie einfach Facebook Pixel im Zonos-Dashboard unter Checkout-Einstellungen → Tracking und stellen Sie sicher, dass Ihr üblicher Meta-Pixel-Basiscode auf der Seite geladen ist. Das unten beschriebene Relay-Setup ist nur erforderlich, wenn Checkout in einem Iframe auf einem anderen Ursprung gehostet wird.

Wie es funktioniert

Da Zonos Checkout in einem Iframe auf einem anderen Ursprung ausgeführt wird, kann es nicht direkt auf die fbq-Funktion Ihrer Seite zugreifen. Das Relay-System löst dieses Problem mit einem zweistufigen Handshake (Schritte 1–2), gefolgt von der Ereignisweiterleitung (Schritt 3):

Checkout sendet einen Ping an das übergeordnete Fenster – Beim Laden des Checkouts im Iframe sendet dieser eine Nachricht an das übergeordnete Fenster, die signalisiert, dass er bereit ist, Ereignisse weiterzuleiten, einschließlich der Pixel-ID.
Übergeordnetes Fenster bestätigt – Das Relay-Skript auf Ihrer Seite empfängt den Ping, erkennt Ihren Meta-Pixel-Basiscode (oder fügt ihn ein) und signalisiert zurück, dass es bereit ist, Ereignisse zu empfangen.
Ereignisse werden weitergeleitet – Während Käufer den Checkout durchlaufen, wird jedes Analyseereignis über postMessage an Ihre Seite gesendet, wo das Relay-Skript es mit dem entsprechenden track- / trackCustom-Modus an fbq weiterleitet.

Alle Nachrichten werden ausschließlich über HTTPS anhand vertrauenswürdiger Zonos-Ursprünge (zonos.com und iglobalstores.com) validiert.

Voraussetzungen

Ein Meta-Pixel mit einer Pixel-ID (eine numerische Zeichenfolge, in der Regel 15–16 Ziffern). Sie können eine im Meta Events Manager erstellen.
Eine Legacy-Checkout-Integration, die Zonos Checkout in einem Iframe auf Ihrer Seite lädt.
Facebook Pixel aktiviert in Ihren Zonos-Checkout-Einstellungen (im Zonos-Dashboard, unter Checkout-Einstellungen -> Tracking).

Einrichtung

Schritt 1: Fügen Sie den Meta-Pixel-Basiscode zu Ihrer Seite hinzu

Wenn Sie Meta Pixel noch nicht auf Ihrer Website installiert haben, fügen Sie den Standard-Pixel-Basiscode zum <head> der Seite hinzu, die den Checkout-Iframe hostet. Ersetzen Sie YOUR_PIXEL_ID durch Ihre eigene numerische Pixel-ID.

1

3<script>

4 !(function (f, b, e, v, n, t, s) {

5 if (f.fbq) return;

6 n = f.fbq = function () {

7 n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments);

8 };

9 if (!f._fbq) f._fbq = n;

10 n.push = n;

11 n.loaded = !0;

12 n.version = '2.0';

13 n.queue = [];

14 t = b.createElement(e);

15 t.async = !0;

16 t.src = v;

17 s = b.getElementsByTagName(e)[0];

18 s.parentNode.insertBefore(t, s);

19 })(

20 window,

21 document,

22 'script',

23 'https://connect.facebook.net/en_US/fbevents.js',

24 );

25 fbq('init', 'YOUR_PIXEL_ID');

26 fbq('track', 'PageView');

27</script>

Hinweis: Wenn auf Ihrer Website bereits Meta Pixel installiert ist (z. B. über Google Tag Manager, die native Integration von Shopify oder ein direktes Snippet), können Sie diesen Schritt überspringen. Das Relay-Skript verwendet Ihre vorhandene fbq-Funktion.

Sie finden dieses Snippet in Ihrem Meta Events Manager unter Ihrem Pixel Einstellungen -> Pixel-Setup fortsetzen -> Code manuell installieren.

Schritt 2: Übergeben Sie Ihre Pixel-ID an Zonos Checkout

Teilen Sie Zonos Checkout mit, welche Pixel-ID verwendet werden soll, indem Sie window.Zonos.facebookPixelId innerhalb des customHTML Ihres Checkouts festlegen. Das Zonos-Dashboard zeigt einen customHTML-Editor unter Checkout-Einstellungen – fügen Sie dort ein <script>-Tag wie folgt hinzu:

1<script>

2 window.Zonos.facebookPixelId = 'YOUR_PIXEL_ID';

3</script>

Dieser Wert wird während des Relay-Handshakes an die übergeordnete Seite gesendet. Wenn auf Ihrer übergeordneten Seite noch kein fbq geladen ist, fügt das Relay-Skript mithilfe dieser ID den Meta-Pixel-Basiscode für Sie ein.

Schritt 3: Fügen Sie das Analyse-Relay-Skript Zonos hinzu

Fügen Sie das folgende Skript-Tag zu derselben Seite hinzu, die den Checkout-Iframe lädt, nach dem Meta-Pixel-Basiscode. Dies ist das gleiche Skript, das auch für Google Analytics 4 verwendet wird – ein einziges Relay verwaltet beide Anbieter. Wenn Sie es bereits für GA4 hinzugefügt haben, überspringen Sie diesen Schritt.

1<script

2 async

3 src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"

4></script>

Vollständiges Beispiel

So sieht die vollständige Einrichtung im <head> Ihrer Seite aus:

1<head>

2 

4 

6 <script>

7 !(function (f, b, e, v, n, t, s) {

8 if (f.fbq) return;

9 n = f.fbq = function () {

10 n.callMethod

11 ? n.callMethod.apply(n, arguments)

12 : n.queue.push(arguments);

13 };

14 if (!f._fbq) f._fbq = n;

15 n.push = n;

16 n.loaded = !0;

17 n.version = '2.0';

18 n.queue = [];

19 t = b.createElement(e);

20 t.async = !0;

21 t.src = v;

22 s = b.getElementsByTagName(e)[0];

23 s.parentNode.insertBefore(t, s);

24 })(

25 window,

26 document,

27 'script',

28 'https://connect.facebook.net/en_US/fbevents.js',

29 );

30 fbq('init', 'YOUR_PIXEL_ID');

31 fbq('track', 'PageView');

32 </script>

34 

36 <script

37 async

38 src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"

39 ></script>

40</head>

Das war's. Sobald beide Skripte auf Ihrer Seite eingebunden sind, Facebook Pixel in Ihrem Zonos-Dashboard aktiviert ist und customHTML die Pixel-ID festlegt, leitet das Relay automatisch alle Checkout-Funnel-Ereignisse an Meta weiter.

Referenz zu Meta-Pixel-Ereignissen

Für jeden Schritt im Trichter löst Zonos Checkout sowohl ein benutzerdefiniertes Ereignis aus (sodass Sie präzise Zielgruppen aufbauen können) als auch das passende Meta-Standardereignis (sodass es im Optimierungs- und Conversion-Reporting von Meta erscheint). Alle Ereignisse enthalten ein isTestMode-Flag und die checkoutSessionId.

Auslöser↕	Benutzerdefiniertes Ereignis (`fbq('trackCustom', ...)`)↕	Standardereignis (`fbq('track', ...)`)↕	Zusätzliche Metadaten↕
Checkout öffnet	`zonos-checkout-start`	`InitiateCheckout`	--
Käufer gibt Kundeninformationen ein	`zonos-checkout-customer-info`	keine	--
Käufer wählt eine Versandart	`zonos-checkout-shipping-info`	keine	`serviceLevelId`
Käufer gibt Zahlungsdetails ein	`zonos-checkout-payment-info`	`AddPaymentInfo`	`paymentMethod`
Zahlungsversuch schlägt fehl	`zonos-checkout-payment-fail`	keine	--
Bestellung erfolgreich abgeschlossen	`zonos-checkout-success`	keine	`order_id`, `currency`, `value`, `contents`, `content_ids`
Bestellung abgeschlossen (E-Commerce-Ereignis)	`purchase`	`Purchase`	`order_id`, `currency`, `value`, `contents`, `content_ids`
Käufer schließt Kasse	`zonos-checkout-close`	keine	--

Schritte ohne Meta-Standardäquivalent (z. B. Kundeninformationen, Versandinformationen) lösen nur das benutzerdefinierte zonos-checkout-...-Ereignis aus. Sie können diese im Meta Ads Manager über benutzerdefinierte Zielgruppen mit „Event = zonos-checkout-customer-info“ gezielt ansprechen, usw.

Metadaten des Purchase-Ereignisses

Das Standardereignis Purchase folgt dem Schema des Meta Pixel Purchase-Ereignisses. Warenkorbartikel werden aus dem items-Array im GA-Stil in Metas contents-Array übertragen:

Feld↕	Beschreibung↕
`value`	Gesamtbestellwert
`currency`	Dreibuchstabiger Währungscode (z. B. `USD`)
`order_id`	Zonos Bestell-ID oder Checkout-Sitzungs-ID
`contents`	Array von Warenkorbartikeln, jeweils mit `id`, `quantity` und `item_price`
`content_ids`	Array von Artikel-IDs (SKU, Produkt-ID oder Produktnamen-Fallback)
`content_type`	Immer `"product"`
`num_items`	Gesamtmenge über alle Artikel

Debuggen

Um die Debug-Protokollierung für das Relay-Skript zu aktivieren, fügen Sie den Abfrageparameter zonosDebug=1 zu Ihrer Seiten-URL hinzu:

1https://www.yourstore.com/checkout?zonosDebug=1

Öffnen Sie die Entwicklerkonsole Ihres Browsers, um detaillierte Protokolle des Relay-Handshakes und der weitergeleiteten Ereignisse anzuzeigen. Dies ist nützlich, um Folgendes zu überprüfen:

Das Relay-Skript empfängt den Ping vom Checkout-Iframe.
Meta Pixel ist mit der richtigen Pixel-ID konfiguriert.
Ereignisse werden mit dem erwarteten track- / trackCustom-Modus an fbq weitergeleitet.

Die Meta Pixel Helper Chrome-Erweiterung ist auch hilfreich, um Pixel-Anrufe in Echtzeit zu überprüfen.

Häufige Fragen

Warum werden zwei Ereignisse für denselben Schritt ausgelöst (z. B. `zonos-checkout-start` und `InitiateCheckout`)?

Metas Standardereignisse ermöglichen von Haus aus Conversion-Optimierung, Anzeigenberichte und Lookalike Audiences. Mit den benutzerdefinierten zonos-checkout-...-Ereignissen können Sie detailliertere benutzerdefinierte Zielgruppen für den genauen Trichterschritt aufbauen, auch wenn kein Meta-Standardäquivalent existiert (z. B. Kundeninformationen, Versandinformationen). Da beide ausgelöst werden, erhalten Sie das Beste aus beiden Welten, ohne dass ein Signal verloren geht.

Was passiert, wenn ich sowohl Google Analytics als auch Facebook Pixel verwende?

Sie benötigen keine zwei Relay-Skripte – dasselbe analyticsRelayOnInit.js verarbeitet beide Anbieter in einem einzigen Handshake. Fügen Sie das GA4-Basis-Tag und den Meta-Pixel-Basiscode in Ihren <head> ein, setzen Sie sowohl window.Zonos.googleAnalyticId als auch window.Zonos.facebookPixelId in customHTML, und aktivieren Sie beide Anbieter in Ihrem Zonos-Dashboard. Jedes Ereignis wird an alle aktivierten Anbieter verteilt.

Was passiert, wenn auf meiner übergeordneten Seite kein Meta Pixel installiert ist?

Wenn Ihr customHTML window.Zonos.facebookPixelId festlegt und das Relay-Skript kein fbq auf der Seite erkennt, fügt es während des Handshakes mit der von Ihnen angegebenen Pixel-ID den Meta-Pixel-Basiscode für Sie ein. Sie können den Meta-Pixel-Basiscode auch selbst vorab installieren, wenn Sie PageView und andere Ereignisse außerhalb des Checkout-Trichters auslösen möchten.

Werden Testaufträge nachverfolgt?

Alle Ereignisse enthalten ein isTestMode-Feld. Wenn sich Checkout im Testmodus befindet, werden Ereignisse weiterhin an Meta weitergeleitet, aber mit isTestMode: true gekennzeichnet. Sie können diese im Meta Ads Manager herausfiltern oder mit benutzerdefinierten Konvertierungsregeln ausschließen.

Ersetzt die Conversions API (CAPI) dies?

Nein – dies ist eine browserseitige Pixel-Integration, die im Browser Ihrer Käufer ausgeführt wird. Die Meta Conversions API ist ein separater Server-zu-Server-Kanal, den manche Händler zusätzlich zum Pixel aus Redundanzgründen nutzen. Die beiden ergänzen sich, und das Relay von Zonos verarbeitet nur das browserseitige Pixel.

Buchen Sie eine Demo