Acompanhe todo o funil de checkout com o Meta (Facebook) Pixel quando utiliza
uma integração do Checkout legado baseada em iframe.
Os comerciantes que utilizam a integração do Checkout legado (iframe alojado em
iglobalstores.com) podem rastrear eventos do Meta Pixel ao longo de todo o
funil de checkout. O Zonos Checkout retransmite automaticamente os eventos de
análise do iframe para a página principal, utilizando o mesmo script de
retransmissão leve usado para o
Google Analytics 4,
pelo que os eventos aparecem no seu Meta Events Manager como se tivessem origem
no seu próprio site.
Para cada etapa do funil, são emitidos dois eventos:
Um evento personalizado com o nome zonos-checkout-... (através de
fbq('trackCustom', ...)) para públicos personalizados de funil completo.
O evento padrão correspondente do Meta (através de fbq('track', ...)) para
a otimização integrada, por exemplo, InitiateCheckout, AddPaymentInfo e
Purchase.
As integrações nativas não precisam deste guia. Se o <zonos-checkout>
for apresentado diretamente no seu site (sem iframe), a Zonos chama o
window.fbq da sua página no próprio local — basta ativar o Facebook Pixel
no Dashboard da Zonos em Definições do Checkout → Rastreio e
garantir que o código base habitual do Meta Pixel está carregado na página.
A configuração de retransmissão abaixo só é necessária quando o Checkout
está alojado num iframe de uma origem diferente.
Como o Zonos Checkout é executado dentro de um iframe numa origem diferente,
não consegue aceder diretamente à função fbq da sua página. O sistema de
retransmissão resolve isto com um handshake em dois passos (passos 1-2),
seguido do reencaminhamento de eventos (passo 3):
O Checkout envia um ping à página principal -- Quando o checkout é
carregado dentro do iframe, envia uma mensagem à janela principal a indicar
que está pronto para retransmitir eventos, incluindo o Pixel ID.
A página principal confirma -- O script de retransmissão na sua página
recebe o ping, deteta (ou injeta) o código base do seu Meta Pixel e
sinaliza de volta que está pronto para receber eventos.
Os eventos são reencaminhados -- À medida que os compradores avançam no
checkout, cada evento de análise é enviado através de postMessage para a
sua página, onde o script de retransmissão o reencaminha para o fbq com o
modo track / trackCustom adequado.
Todas as mensagens são validadas em relação às origens fidedignas da Zonos
(zonos.com e iglobalstores.com), exclusivamente através de HTTPS.
Passo 1: adicione o código base do Meta Pixel à sua página
Se ainda não tem o Meta Pixel instalado no seu site, adicione o código base
padrão do Pixel ao <head> da página que aloja o iframe do Checkout.
Substitua YOUR_PIXEL_ID pelo seu próprio Pixel ID numérico.
Nota: Se o seu site já tem o Meta Pixel instalado (por exemplo, através
do Google Tag Manager, da integração nativa do Shopify ou de um snippet
direto), pode saltar este passo. O script de retransmissão utilizará a sua
função fbq existente.
Pode encontrar este snippet no seu Meta Events Manager, em Definições do
seu Pixel -> Continuar a configuração do Pixel -> Instalar o código
manualmente.
Passo 2: transmita o seu Pixel ID ao Zonos Checkout
Indique ao Zonos Checkout qual o Pixel ID a utilizar, definindo
window.Zonos.facebookPixelId no customHTML do seu Checkout. O Dashboard da
Zonos disponibiliza um editor de customHTML nas definições do Checkout --
adicione uma tag <script> como esta:
1<script>
2window.Zonos.facebookPixelId = 'YOUR_PIXEL_ID';
3</script>
Este valor é enviado à página principal durante o handshake de retransmissão.
Se a sua página principal ainda não tiver o fbq carregado, o script de
retransmissão injetará o código base do Meta Pixel por si, utilizando este ID.
Passo 3: adicione o script de retransmissão de análise da Zonos
Adicione a seguinte tag de script à mesma página que carrega o iframe do
Checkout, a seguir ao código base do Meta Pixel. Este é o mesmo script
utilizado para o Google Analytics 4 -- uma única retransmissão trata dos dois
fornecedores, por isso, se já o adicionou para o GA4, salte este passo.
E pronto. Assim que ambos os scripts estiverem na sua página, o Facebook Pixel
estiver ativado no Dashboard da Zonos e o customHTML definir o Pixel ID, a
retransmissão reencaminha automaticamente todos os eventos do funil de checkout
para o Meta.
Em cada etapa do funil, o Zonos Checkout dispara tanto um evento personalizado
(para que possa criar públicos precisos) como o evento padrão correspondente do
Meta (para que apareça nos relatórios de otimização e de conversões do Meta).
Todos os eventos incluem um indicador isTestMode e o checkoutSessionId.
Acionador↕
Evento personalizado (fbq('trackCustom', ...))↕
Evento padrão (fbq('track', ...))↕
Metadados adicionais↕
O checkout é aberto
zonos-checkout-start
InitiateCheckout
--
O comprador introduz os dados do cliente
zonos-checkout-customer-info
nenhum
--
O comprador seleciona um método de envio
zonos-checkout-shipping-info
nenhum
serviceLevelId
O comprador introduz os dados de pagamento
zonos-checkout-payment-info
AddPaymentInfo
paymentMethod
A tentativa de pagamento falha
zonos-checkout-payment-fail
nenhum
--
A encomenda é concluída com sucesso
zonos-checkout-success
nenhum
order_id, currency, value, contents, content_ids
A encomenda é concluída (evento de e-commerce)
purchase
Purchase
order_id, currency, value, contents, content_ids
O comprador fecha o checkout
zonos-checkout-close
nenhum
--
As etapas sem um evento padrão equivalente do Meta (por exemplo, dados do
cliente, dados de envio) disparam apenas o evento personalizado
zonos-checkout-.... Pode segmentá-las no Meta Ads Manager através de
públicos personalizados, utilizando "Event = zonos-checkout-customer-info",
etc.
Metadados do evento Purchase
O evento padrão Purchase segue o esquema do
evento Purchase do Meta Pixel.
Os artigos do carrinho são mapeados a partir do array items ao estilo do GA
para o array contents do Meta:
Campo↕
Descrição↕
value
Valor total da encomenda
currency
Código de moeda de três letras (por exemplo, USD)
order_id
ID da encomenda Zonos ou ID da sessão de checkout
contents
Array de artigos do carrinho, cada um com id, quantity e item_price
content_ids
Array de IDs dos artigos (o SKU, o ID do produto ou, em alternativa, o nome do produto)
Para ativar o registo de depuração do script de retransmissão, adicione o
parâmetro de consulta zonosDebug=1 ao URL da sua página:
1https://www.yourstore.com/checkout?zonosDebug=1
Abra a consola de programador do seu navegador para ver registos detalhados do
handshake de retransmissão e dos eventos reencaminhados. Isto é útil para
verificar que:
O script de retransmissão recebe o ping do iframe do checkout.
O Meta Pixel está configurado com o Pixel ID correto.
Os eventos estão a ser reencaminhados para o fbq com o modo track /
trackCustom esperado.
A extensão do Chrome
Meta Pixel Helper
também é útil para inspecionar as chamadas do Pixel em tempo real.
Porque são disparados dois eventos para a mesma etapa (por exemplo, zonos-checkout-start e InitiateCheckout)?
Os eventos padrão do Meta alimentam, de origem, a otimização de conversões, os
relatórios de anúncios e os públicos semelhantes. Os eventos personalizados
zonos-checkout-... permitem criar públicos personalizados mais granulares na
etapa exata do funil, mesmo quando não existe um equivalente padrão do Meta
(por exemplo, dados do cliente, dados de envio). Disparar ambos oferece o
melhor dos dois mundos, sem perder qualquer sinal.
E se estiver a utilizar o Google Analytics e o Facebook Pixel em simultâneo?
Não precisa de dois scripts de retransmissão -- o mesmo
analyticsRelayOnInit.js trata dos dois fornecedores num único handshake.
Adicione a tag base do GA4 e o código base do Meta Pixel ao seu <head>,
defina window.Zonos.googleAnalyticId e window.Zonos.facebookPixelId no
customHTML e ative ambos os fornecedores no Dashboard da Zonos. Cada evento é
distribuído pelos fornecedores que estiverem ativados.
E se a minha página principal não tiver o Meta Pixel instalado?
Se o seu customHTML definir window.Zonos.facebookPixelId e o script de
retransmissão não detetar nenhum fbq na página, injetará o código base do
Meta Pixel por si durante o handshake, utilizando o Pixel ID que forneceu.
Também pode pré-instalar o código base do Meta Pixel por conta própria, caso
pretenda disparar PageView e outros eventos fora do funil de checkout.
As encomendas de teste são rastreadas?
Todos os eventos incluem um campo isTestMode. Quando o Checkout está em modo
de teste, os eventos continuam a ser retransmitidos para o Meta, mas são
assinalados com isTestMode: true. Pode filtrá-los no Meta Ads Manager ou
excluí-los com regras de conversão personalizadas.
A Conversions API (CAPI) substitui isto?
Não -- esta é uma integração do Pixel do lado do navegador, que é executada nos
navegadores dos seus compradores. A Meta Conversions API é um canal separado,
de servidor para servidor, que alguns comerciantes utilizam em conjunto com o
Pixel para redundância. Os dois são complementares e a retransmissão da Zonos
trata apenas do Pixel do lado do navegador.
Facebook Pixel
Facebook Pixel para o Checkout em iframe
Acompanhe todo o funil de checkout com o Meta (Facebook) Pixel quando utiliza uma integração do Checkout legado baseada em iframe.
Os comerciantes que utilizam a integração do Checkout legado (iframe alojado em
iglobalstores.com) podem rastrear eventos do Meta Pixel ao longo de todo o funil de checkout. O Zonos Checkout retransmite automaticamente os eventos de análise do iframe para a página principal, utilizando o mesmo script de retransmissão leve usado para o Google Analytics 4, pelo que os eventos aparecem no seu Meta Events Manager como se tivessem origem no seu próprio site.Para cada etapa do funil, são emitidos dois eventos:
zonos-checkout-...(através defbq('trackCustom', ...)) para públicos personalizados de funil completo.fbq('track', ...)) para a otimização integrada, por exemplo,InitiateCheckout,AddPaymentInfoePurchase.Como funciona
Como o Zonos Checkout é executado dentro de um iframe numa origem diferente, não consegue aceder diretamente à função
fbqda sua página. O sistema de retransmissão resolve isto com um handshake em dois passos (passos 1-2), seguido do reencaminhamento de eventos (passo 3):postMessagepara a sua página, onde o script de retransmissão o reencaminha para ofbqcom o modotrack/trackCustomadequado.Todas as mensagens são validadas em relação às origens fidedignas da Zonos (
zonos.comeiglobalstores.com), exclusivamente através de HTTPS.Pré-requisitos
Configuração
Passo 1: adicione o código base do Meta Pixel à sua página
Se ainda não tem o Meta Pixel instalado no seu site, adicione o código base padrão do Pixel ao
<head>da página que aloja o iframe do Checkout. SubstituaYOUR_PIXEL_IDpelo seu próprio Pixel ID numérico.<!-- 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>Pode encontrar este snippet no seu Meta Events Manager, em Definições do seu Pixel -> Continuar a configuração do Pixel -> Instalar o código manualmente.
Passo 2: transmita o seu Pixel ID ao Zonos Checkout
Indique ao Zonos Checkout qual o Pixel ID a utilizar, definindo
window.Zonos.facebookPixelIdnocustomHTMLdo seu Checkout. O Dashboard da Zonos disponibiliza um editor decustomHTMLnas definições do Checkout -- adicione uma tag<script>como esta:<script>window.Zonos.facebookPixelId = 'YOUR_PIXEL_ID';</script>Este valor é enviado à página principal durante o handshake de retransmissão. Se a sua página principal ainda não tiver o
fbqcarregado, o script de retransmissão injetará o código base do Meta Pixel por si, utilizando este ID.Passo 3: adicione o script de retransmissão de análise da Zonos
Adicione a seguinte tag de script à mesma página que carrega o iframe do Checkout, a seguir ao código base do Meta Pixel. Este é o mesmo script utilizado para o Google Analytics 4 -- uma única retransmissão trata dos dois fornecedores, por isso, se já o adicionou para o GA4, salte este passo.
<scriptasyncsrc="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"></script>Exemplo completo
Eis o aspeto da configuração completa no
<head>da sua página:<head><!-- ... your existing 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 analytics relay for iframe checkout --><scriptasyncsrc="https://cdn.jsdelivr.net/npm/@zonos/elements/dist/scripts/analyticsRelayOnInit.js"></script></head>E pronto. Assim que ambos os scripts estiverem na sua página, o Facebook Pixel estiver ativado no Dashboard da Zonos e o
customHTMLdefinir o Pixel ID, a retransmissão reencaminha automaticamente todos os eventos do funil de checkout para o Meta.Referência de eventos do Meta Pixel
Em cada etapa do funil, o Zonos Checkout dispara tanto um evento personalizado (para que possa criar públicos precisos) como o evento padrão correspondente do Meta (para que apareça nos relatórios de otimização e de conversões do Meta). Todos os eventos incluem um indicador
isTestModee ocheckoutSessionId.fbq('trackCustom', ...))↕fbq('track', ...))↕zonos-checkout-startInitiateCheckoutzonos-checkout-customer-infozonos-checkout-shipping-infoserviceLevelIdzonos-checkout-payment-infoAddPaymentInfopaymentMethodzonos-checkout-payment-failzonos-checkout-successorder_id,currency,value,contents,content_idspurchasePurchaseorder_id,currency,value,contents,content_idszonos-checkout-closeMetadados do evento Purchase
O evento padrão
Purchasesegue o esquema do eventoPurchasedo Meta Pixel. Os artigos do carrinho são mapeados a partir do arrayitemsao estilo do GA para o arraycontentsdo Meta:valuecurrencyUSD)order_idcontentsid,quantityeitem_pricecontent_idscontent_type"product"num_itemsDepuração
Para ativar o registo de depuração do script de retransmissão, adicione o parâmetro de consulta
zonosDebug=1ao URL da sua página:https://www.yourstore.com/checkout?zonosDebug=1Abra a consola de programador do seu navegador para ver registos detalhados do handshake de retransmissão e dos eventos reencaminhados. Isto é útil para verificar que:
fbqcom o modotrack/trackCustomesperado.A extensão do Chrome Meta Pixel Helper também é útil para inspecionar as chamadas do Pixel em tempo real.
Perguntas frequentes
Porque são disparados dois eventos para a mesma etapa (por exemplo,
zonos-checkout-starteInitiateCheckout)?Os eventos padrão do Meta alimentam, de origem, a otimização de conversões, os relatórios de anúncios e os públicos semelhantes. Os eventos personalizados
zonos-checkout-...permitem criar públicos personalizados mais granulares na etapa exata do funil, mesmo quando não existe um equivalente padrão do Meta (por exemplo, dados do cliente, dados de envio). Disparar ambos oferece o melhor dos dois mundos, sem perder qualquer sinal.E se estiver a utilizar o Google Analytics e o Facebook Pixel em simultâneo?
Não precisa de dois scripts de retransmissão -- o mesmo
analyticsRelayOnInit.jstrata dos dois fornecedores num único handshake. Adicione a tag base do GA4 e o código base do Meta Pixel ao seu<head>, definawindow.Zonos.googleAnalyticIdewindow.Zonos.facebookPixelIdnocustomHTMLe ative ambos os fornecedores no Dashboard da Zonos. Cada evento é distribuído pelos fornecedores que estiverem ativados.E se a minha página principal não tiver o Meta Pixel instalado?
Se o seu
customHTMLdefinirwindow.Zonos.facebookPixelIde o script de retransmissão não detetar nenhumfbqna página, injetará o código base do Meta Pixel por si durante o handshake, utilizando o Pixel ID que forneceu. Também pode pré-instalar o código base do Meta Pixel por conta própria, caso pretenda dispararPageViewe outros eventos fora do funil de checkout.As encomendas de teste são rastreadas?
Todos os eventos incluem um campo
isTestMode. Quando o Checkout está em modo de teste, os eventos continuam a ser retransmitidos para o Meta, mas são assinalados comisTestMode: true. Pode filtrá-los no Meta Ads Manager ou excluí-los com regras de conversão personalizadas.A Conversions API (CAPI) substitui isto?
Não -- esta é uma integração do Pixel do lado do navegador, que é executada nos navegadores dos seus compradores. A Meta Conversions API é um canal separado, de servidor para servidor, que alguns comerciantes utilizam em conjunto com o Pixel para redundância. Os dois são complementares e a retransmissão da Zonos trata apenas do Pixel do lado do navegador.
Esta página foi útil?