Slik fungerer det
Fordi Zonos Checkout kjører inne i en iframe på en annen opprinnelse, kan det
ikke direkte få tilgang til fbq-funksjonen på siden din. Relésystemet løser dette
med en to-trinns håndtrykking (trinn 1-2) etterfulgt av viderekobling av hendelser (trinn 3):
- Checkout pinger den overordnede siden -- Når checkout lastes inne i iframe-en, sender det en melding til den overordnede vinduet som indikerer at den er klar til å relé hendelser, inkludert Pixel-ID-en.
- Overordnet side bekrefter -- Reléskriptet på siden din mottar pingingen, oppdager (eller injiserer) Meta Pixel-basiskoden din, og signaliserer tilbake at det er klart til å motta hendelser.
- Hendelser blir viderekobler -- Etter hvert som kjøpere gjennomgår checkout, sendes hver
analysehendelse via
postMessagetil siden din, der reléskriptet viderekoppler den tilfbqmed passendetrack/trackCustommodus.
Alle meldinger valideres mot klarerte Zonos-opprinnelser (zonos.com og
iglobalstores.com) bare over HTTPS.
Forutsetninger
- En Meta Pixel med en Pixel-ID (en numerisk streng, typisk 15-16 siffer). Du kan opprette en i Meta Events Manager.
- En legacy Checkout-integrasjon som laster Zonos Checkout i en iframe på siden din.
- Facebook Pixel aktivert i Zonos Checkout-innstillingene dine (i Zonos-dashbordet, under Checkout-innstillinger -> Sporing).
Oppsett
Trinn 1: Legg til Meta Pixel-basiskoden på siden
Hvis du ikke allerede har Meta Pixel installert på nettstedet ditt, legger du til standard
Pixel-basiskoden i <head> på siden som er vert for Checkout iframe-en.
Erstatt YOUR_PIXEL_ID med din egen numeriske Pixel-ID.
<!-- Meta Pixel Code --> <script> !(function (f, b, e, v, n, t, s) { if (f.fbq) return; n = f.fbq = function () { n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments); }; if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0'; n.queue = []; t = b.createElement(e); t.async = !0; t.src = v; s = b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t, s); })( window, document, 'script', 'https://connect.facebook.net/en_US/fbevents.js', ); fbq('init', 'YOUR_PIXEL_ID'); fbq('track', 'PageView');</script>Merknad: Hvis nettstedet ditt allerede har Meta Pixel installert (f.eks. gjennom Google Tag Manager, Shopify sin native integrasjon eller et direkte utdrag), kan du hoppe over dette trinnet. Reléskriptet vil bruke din eksisterende
fbq-funksjon.
Du finner dette utdraget i Meta Events Manager under Pixel-innstillingene dine Innstillinger -> Fortsett Pixel-oppsett -> Installer kode manuelt.
Trinn 2: Overfør Pixel-ID-en til Zonos Checkout
Fortell Zonos Checkout hvilken Pixel-ID som skal brukes ved å angi window.Zonos.facebookPixelId
inne i Checkout-en din customHTML. Zonos-dashbordet viser en
customHTML-editor under Checkout-innstillinger -- legg til en <script>-tag slik:
<script> window.Zonos.facebookPixelId = 'YOUR_PIXEL_ID';</script>Denne verdien sendes til den overordnede siden under reléhåndtrykkingen. Hvis den overordnede siden din ikke allerede har fbq lastet, vil reléskriptet injisere Meta Pixel-basiskoden for deg ved hjelp av denne ID-en.
Trinn 3: Legg til Zonos-analyserelé-skriptet
Legg til følgende script-tag på samme side som laster Checkout iframe-en, etter Meta Pixel-basiskoden. Dette er det samme skriptet som brukes til Google Analytics 4 -- ett enkelt relé håndterer begge leverandørene, så hvis du allerede har lagt det til for GA4, kan du hoppe over dette trinnet.
<script async src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"></script>Fullstendig eksempel
Her er hva det fullstendige oppsettet ser ut som i siden din <head>:
<head> <!-- ... dine eksisterende head-tags ... --> <!-- Meta Pixel Code --> <script> !(function (f, b, e, v, n, t, s) { if (f.fbq) return; n = f.fbq = function () { n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments); }; if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0'; n.queue = []; t = b.createElement(e); t.async = !0; t.src = v; s = b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t, s); })( window, document, 'script', 'https://connect.facebook.net/en_US/fbevents.js', ); fbq('init', 'YOUR_PIXEL_ID'); fbq('track', 'PageView'); </script> <!-- Zonos-analyserelé for iframe checkout --> <script async src="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js" ></script></head>Det er det. Når begge skriptene er på siden din, Facebook Pixel er aktivert i Zonos-dashbordet, og customHTML angir Pixel-ID-en, releet viderekoppler automatisk alle checkout-trakthendelser til Meta.
Meta Pixel-referanse for hendelser
For hvert trinn i trakten sender Zonos Checkout både en tilpasset hendelse (slik at du kan bygge presise målgrupper) og den matchende Meta-standardhendelsen (slik at den vises i Meta-optimalisering og konverteringsrapportering). Alle hendelser inkluderer et isTestMode-flagg og checkoutSessionId.
| Utløser↕ | Tilpasset hendelse (fbq('trackCustom', ...))↕ | Standardhendelse (fbq('track', ...))↕ | Tilleggmetadata↕ |
|---|---|---|---|
| Checkout åpnes | zonos-checkout-start | InitiateCheckout | -- |
| Kjøper oppgir kundeinformasjon | zonos-checkout-customer-info | ingen | -- |
| Kjøper velger en leveringsmetode | zonos-checkout-shipping-info | ingen | serviceLevelId |
| Kjøper oppgir betalingsdetaljer | zonos-checkout-payment-info | AddPaymentInfo | paymentMethod |
| Betalingsforsøk mislykkes | zonos-checkout-payment-fail | ingen | -- |
| Ordre fullføres vellykket | zonos-checkout-success | ingen | order_id, currency, value, contents, content_ids |
| Ordre fullføres (e-handelshendelses) | purchase | Purchase | order_id, currency, value, contents, content_ids |
| Kjøper lukker checkout | zonos-checkout-close | ingen | -- |
Trinn uten Meta-standardekvivalent (f.eks. kundeinformasjon, leveringsinformasjon) sender bare den tilpassede
zonos-checkout-...-hendelsen. Du kan målrette disse i Meta Ads Manager via egendefinerte målgrupper ved å bruke "Hendelse =zonos-checkout-customer-info", osv.
Metdata for Purchase-hendelse
Purchase-standardhendelsen følger
Meta Pixel Purchase-hendelse
skjemaet. Handlekurvvarer blir kartlagt fra GA-stilen items-matrisen inn i Meta sin contents-matrise:
| Felt↕ | Beskrivelse↕ |
|---|---|
value | Samlet ordrebeløp |
currency | Tresifret valutakode (f.eks. USD) |
order_id | Zonos ordre-ID eller checkout-sesjons-ID |
contents | Matrise med handlekurvvarer, hver med id, quantity og item_price |
content_ids | Matrise med vare-ID-er (SKU, produkt-ID eller produktnavn fallback) |
content_type | Alltid "product" |
num_items | Samlet mengde på tvers av alle varer |
Feilsøking
For å aktivere feilsøkingslogging for reléskriptet, legger du til zonosDebug=1-spørreparameteren til side-URLen din:
https://www.yourstore.com/checkout?zonosDebug=1Åpne nettleserens utviklerkonsoll for å se detaljerte logger over relé-håndtrykkingen og videresendte hendelser. Dette er nyttig for å verifisere at:
- Reléskriptet mottar pingingen fra checkout iframe-en.
- Meta Pixel er konfigurert med riktig Pixel-ID.
- Hendelser videresendes til
fbqmed forventettrack/trackCustom-modus.
Meta Pixel Helper Chrome-utvidelsen er også nyttig for å inspektere Pixel-kall i sanntid.
Vanlige spørsmål
Hvorfor sendes to hendelser for samme trinn (f.eks. zonos-checkout-start og InitiateCheckout)?
Metas standardhendelser driver konverteringsoptimalisering, annonserapportering og lookalike-målgrupper uten tillegg. De tilpassede zonos-checkout-...-hendelsene lar deg bygge mer granulære egendefinerte målgrupper på det nøyaktige trakttrinnet, selv når det ikke finnes noen Meta-standardekvivalent (f.eks. kundeinformasjon, leveringsinformasjon). Å skyte begge gir deg det beste fra begge verdener uten å miste noe signal.
Hva hvis jeg kjører både Google Analytics og Facebook Pixel?
Du trenger ikke to reléskripter -- det samme analyticsRelayOnInit.js håndterer begge leverandørene i en enkelt håndtrykking. Legg til GA4-basistagen og Meta Pixel-basiskoden til din <head>, angi både window.Zonos.googleAnalyticId og window.Zonos.facebookPixelId i customHTML, og aktiver begge leverandørene i Zonos-dashbordet. Hver hendelse blir spredt til hvilken som helst leverandører som er aktivert.
Hva hvis siden min ikke har Meta Pixel installert?
Hvis customHTML angir window.Zonos.facebookPixelId og reléskriptet ikke oppdager noen fbq på siden, vil det injisere Meta Pixel-basiskoden for deg
under håndtrykkingen ved hjelp av Pixel-ID-en du oppgav. Du kan også pre-installere Meta Pixel-basiskoden selv hvis du vil skyte PageView og andre hendelser utenfor checkout-trakten.
Blir testrundene sporet?
Alle hendelser inkluderer et isTestMode-felt. Når Checkout er i testmodus, blir hendelser fortsatt releet til Meta men flagget med isTestMode: true. Du kan filtrere disse ut i Meta Ads Manager eller ekskludere dem med egendefinerte konverteringsregler.
Erstatter Conversions API (CAPI) dette?
Nei -- dette er en browser-side Pixel-integrasjon som kjører i kjøpernes nettlesere. Meta Conversions API er en separat server-til-server-kanal som noen selgere bruker ved siden av Pixel for redundans. De to er komplementære og Zonos sitt relé håndterer bare browser-side Pixel.
Facebook Pixel for iframe Checkout
Spor hele checkout-trakten med Meta (Facebook) Pixel når du bruker en iframe-basert legacy Checkout-integrasjon.
Selgere som bruker legacy Checkout-integrasjonen (iframe som er vert på
iglobalstores.com) kan spore Meta Pixel-hendelser gjennom hele checkout-trakten. Zonos Checkout relayerer automatisk analysehendelser fra iframe-en til overordnet side ved hjelp av det samme lette reléskriptet som brukes til Google Analytics 4, så hendelser vises i Meta Events Manager som om de stammer fra ditt eget nettsted.For hvert trinn i trakten sendes to hendelser:
zonos-checkout-...(viafbq('trackCustom', ...)) for fullständig traktkontroll av egendefinerte målgrupper.fbq('track', ...)) for innebygd optimalisering, f.eks.InitiateCheckout,AddPaymentInfoogPurchase.