Come dicevo in quest’articolo, settimana scorsa, i tracciamenti del checkout su Shopify sono cambiati e parecchio.
Ora bisogna accedere alla sezione Impostazioni > Eventi del cliente e di volta in volta creare il pixel che serve.
Oggi vorrei lasciarti il codice corretto per inserire il pixel Meta nel checkout Shopify e più precisamente come inserirlo correttamente negli Eventi del cliente.
Dal pixel Meta normale, come siamo abituati a vederlo normalmente, bisogna rimuovere l’HTML, ti ritrovi con il pixel SDK di Meta e il codice per inizializzarlo. In questo momento la PageView va rimossa, perchè verrà aggiunta nel passaggio successivo.
!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);
In questo modo il pixel Meta è solo inizializzato. Perchè possa trasmettere anche i dati si deve creare un evento.
analytics.subscribe("page_viewed", async (event) => {
fbq('track', 'PageView');
});
Per prima cosa devi mandare l’evento PageView, per fargli capire che la pagina è stata visualizzata.
analytics.subscribe("checkout_completed", async (event) => {
fbq('track', 'Purchase', {
content_ids: [event.data?.productVariant?.id],
content_name: event.data?.productVariant?.title,
currency: event.data?.productVariant?.price?.currencyCode,
value: event.data?.productVariant?.price.amount,
});
});
E poi traccerai l’evento purchase con valore e valuta, ma dovresti inserire anche l’array dei prodotti acquistati, volendo anche i dati utente per fare l’advanced matching.
Qui puoi trovare il set standard di eventi previsti da Shopify a cui potrai agganciare gli eventi Meta.
Un esempio di tracciamento Meta un po’ più completo è questo:
!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');
// replace YOUR_PIXEL_ID with the pixel ID provided by third-party
fbq('init', YOUR_PIXEL_ID);
// integrate third-party pixel tracking
analytics.subscribe("page_viewed", (event) => {
fbq('track', 'PageView');
});
analytics.subscribe("product_viewed", (event) => {
fbq('track', 'ViewContent', {
content_ids: [event.data?.productVariant?.id],
content_name: event.data?.productVariant?.title,
currency: event.data?.productVariant?.price.currencyCode,
value: event.data?.productVariant?.price.amount,
});
});
analytics.subscribe("search_submitted", (event) => {
fbq('track', 'Search', {
search_string: event.searchResult.query
});
});
analytics.subscribe("product_added_to_cart", (event) => {
fbq('track', 'AddToCart', {
content_ids: [event.data?.cartLine?.merchandise?.productVariant?.id],
content_name: event.data?.cartLine?.merchandise?.productVariant?.title,
currency: event.data?.cartLine?.merchandise?.productVariant?.price?.currencyCode,
value: event.data?.cartLine?.merchandise?.productVariant?.price.amount,
});
});
analytics.subscribe("payment_info_submitted", (event) => {
fbq('track', 'AddPaymentInfo');
});
analytics.subscribe("checkout_started", (event) => {
fbq('track', 'InitiateCheckout');
});
analytics.subscribe("checkout_completed", (event) => {
fbq('track', 'Purchase', {
currency: event.data?.checkout?.currencyCode,
value: event.data?.checkout?.totalPrice?.amount,
});
});
Se devi effettuare dei tracciamenti su un sito Shopify, contattami attraverso questo modulo.
