Monitoraggio pixel nella pagina post-acquisto

Attenzione

Gli script di monitoraggio sono personalizzazioni avanzate non supportate dal team di assistenza di Shopify. È necessaria la conoscenza di linguaggi di web design come HTML, CSS, JavaScript e Liquid. Se riscontri difficoltà a lavorare con gli script, valuta la possibilità di contattare un Esperto Shopify.

Se nel tuo negozio è stata installata un'app per aggiungere una pagina post-acquisto al check-out, il monitoraggio pixel personalizzato che utilizzi nel negozio potrebbe non acquisire determinati eventi di monitoraggio. I pixel di monitoraggio personalizzati aggiunti alla casella Script aggiuntivi del negozio monitorano solo gli eventi nella pagina di stato dell'ordine, che è successiva alla pagina post-acquisto del check-out. Se un cliente abbandona il negozio mentre si trova nella pagina post-acquisto, non verrà monitorato nessun evento della pagina di stato dell'ordine.

Per assicurarti di acquisire correttamente gli eventi di conversione, puoi aggiungere alla pagina post-acquisto uno script che monitora gli eventi e che può anche monitorare gli acquisti aggiuntivi effettuati dalla pagina post-acquisto, come l'upselling. Dopo aver aggiunto uno script della pagina post-acquisto, dovrai modificare lo script della pagina di stato dell'ordine in modo tale che ignori gli eventi già acquisiti dallo script della pagina post-acquisto.

Devi modificare il modo in cui il tuo negozio monitora gli eventi solo se utilizzi un pixel di monitoraggio personalizzato. Ad esempio, se configuri Google Analytics da Negozio online > Preferenze, gli eventi verranno già acquisiti correttamente nella pagina post-acquisto.

Considerazioni

Lo script aggiuntivo della pagina post-acquisto è simile agli script aggiuntivi della pagina di stato dell'ordine, ma presenta alcune differenze chiave:

• Lo script viene aggiunto alla pagina post-acquisto, non alla pagina di stato dell'ordine.
• Il campo consente solo il linguaggio JavaScript. Il codice Liquid non è accettato.
• L'unico tag HTML consentito è <script>.
• Lo script viene eseguito all'interno di una sandbox e non è incluso nella pagina principale.
• Puoi aggiungere uno script della pagina post-acquisto solo se nel tuo negozio è installata un'app per aggiungere una pagina post-acquisto al check-out.

L'esecuzione dello script all'interno di una sandbox garantisce che lo script sia sicuro e che venga utilizzato per lo scopo previsto.

L'Assistenza Shopify non può aiutarti con gli script delle pagine post-acquisto. Se hai bisogno di assistenza, puoi pubblicare un messaggio nella community di Shopify o contattare un Esperto Shopify.

Compatibilità con gli script della pagina di stato dell'ordine

Per assicurarti che i pixel monitorino correttamente tutti gli eventi di conversione, configura gli script di monitoraggio sia nella pagina post-acquisto sia nella pagina di stato dell'ordine. Per evitare di contare gli stessi eventi di conversione due volte, puoi utilizzare la variabile Liquid post_purchase_page_accessed negli script eseguiti nella pagina di stato dell'ordine.

Se un cliente arriva alla pagina post-acquisto e passa alla pagina di stato dell'ordine, la variabile post_purchase_page_accessed restituisce il valore true. Se un cliente non arriva alla pagina post-acquisto, la variabile restituisce il valore false.

Ad esempio, per gli script nella pagina di stato dell'ordine puoi utilizzare il formato seguente:

{% if first_time_accessed == true and post_purchase_page_accessed == false %}
<script>
   // insert your tracking script
</script>
{% endif %}

API disponibili

Puoi utilizzare le variabili globali JavaScript per fornire agli script di monitoraggio l'accesso ai dati di cui hanno bisogno. I dati accessibili sono disponibili alla voce window.Shopify.

Monitoraggio degli acquisti effettuati nella pagina post-acquisto

Per monitorare ulteriori acquisti effettuati tramite la pagina post-acquisto, puoi iscriverti all'evento Shopify.on.

Dopo l'iscrizione, ogni volta che viene applicato correttamente un insieme di modifiche post-acquisto si verificano le azioni seguenti:

• Il gestore viene chiamato con due argomenti di tipo Order: order e outdated order.
• Le variabili globali alla voce window.Shopify vengono aggiornate in modo che gli script possano utilizzare i dati più recenti.

Per l'esecuzione dei gestori iscritti a questo evento potrebbero essere disponibili appena 500 ms. Assicurati di caricare in anticipo tutte le dipendenze necessarie.

Aggiunta dello script della pagina post-acquisto

1. Dal pannello di controllo Shopify, vai a Impostazioni > Check-out.
2. Inserisci lo script nel campo Script aggiuntivi post-acquisto.
3. Clicca su Salva.

Script di esempio

Puoi utilizzare il seguente modello di script di base per creare il tuo script della pagina post-acquisto. Questo script di esempio utilizza Google Analytics per monitorare la conversione iniziale e spiega come monitorare ulteriori acquisti. Questo esempio è molto semplice, il tuo script finale sarà probabilmente diverso da questo.

File dello script di esempio

Script di esempio per la pagina di stato dell'ordine:

<script async src="https://www.googletagmanager.com/gtag/js?id=G-FYNQ742HTX"></script>
<script>
(function() {
  // make sure the initial conversion isn't tracked twice
  {% if first_time_accessed == false or post_purchase_page_accessed == true %}
    return;
  {% endif %}
  // set up google analytics
  window.dataLayer = window.dataLayer || [];
  function gtag() {
    dataLayer.push(arguments);
  }
  gtag('js', new Date());
  gtag('config', 'G-FYNQ742HTX');
  // track initial conversion
  var order = window.Shopify.order;

  gtag('event', 'purchase', {
    affiliation: 'My Shopify Store',
    transaction_id: Number(order.id).toString(),
    value: order.totalPrice,
    currency: order.currency,
    items: order.lineItems.map((item) => ({
      id: Number(item.id).toString(),
      name: item.title,
      category: item.product.type,
      price: item.price,
      quantity: item.quantity,
      variant: Number(item.variant.sku).toString(),
    })),
  });
})();
</script>

Script di esempio per la pagina post-acquisto:

<script async src="https://www.googletagmanager.com/gtag/js?id=G-FYNQ742HTX"></script>
<script>
(function() {
  // set up google analytics
  window.dataLayer = window.dataLayer || [];

  function gtag() {
    dataLayer.push(arguments);
  }

  gtag('js', new Date());
  gtag('config', 'G-FYNQ742HTX');

  // make sure the initial conversion isn't tracked twice
  if (!Shopify.wasPostPurchasePageSeen) {
    var order = window.Shopify.order;

    // track initial conversion
    gtag('event', 'purchase', {
      affiliation: 'My Shopify Store',
      transaction_id: Number(order.id).toString(),
      value: order.totalPrice,
      currency: order.currency,
      items: order.lineItems.map(function(item) {
        return {
          id: Number(item.id).toString(),
          name: item.title,
          category: item.product.type,
          price: item.price,
          quantity: item.quantity,
          variant: Number(item.variant.sku).toString(),
        };
      }),
    });
  }

  // set up additional conversion tracking
  Shopify.on('CheckoutAmended', function(newOrder, previousOrder) {
    // identify which items were recently added, if any
    var oldItems = previousOrder.lineItems.map(function (line) { return line.id; });

    var addedItems = newOrder.lineItems.filter(
      function (line) { return oldItems.indexOf(line.id) < 0; }
    );

    // no new items were added, so we skip conversion tracking
    if (addedItems.length === 0) {
      return;
    }

    // track additional purchase
    gtag('event', 'purchase', {
      affiliation: 'My Shopify Store',
      transaction_id: Number(order.id).toString(),
      value: order.totalPrice,
      currency: order.currency,
      items: addedItems.map(function (item) {
        return {
          id: Number(item.id).toString(),
          name: item.title,
          category: item.product.type,
          price: item.price,
          quantity: item.quantity,
          variant: Number(item.variant.sku).toString(),
        };
      }),
    });
  });
})();
</script>

Referenze

La tabella seguente contiene le definizioni dei tipi per gli attributi esposti agli script aggiuntivi post-acquisto tramite window.Shopify:

Campo	Definizione
window.Shopify
shop	I dettagli del negozio da cui è stato effettuato l'ordine.
order	I dettagli dell'ordine.
pageUrl	L'URL della pagina corrente.
wasPostPurchasePageSeen	Indica se il cliente ha visualizzato la pagina post-acquisto durante questo check-out. Sarà false durante la prima visualizzazione e true negli altri casi, ad esempio se la pagina viene ricaricata.
on(event: string, handler: function): void	Effettua l'iscrizione a un event. Al momento è supportato solo l'evento CheckoutAmended.
off(event: string, handler: function): void	Annulla l'iscrizione di handler a un determinato event. Al momento è supportato solo l'evento CheckoutAmended.
Shop
id	L'ID del negozio.
currency	La valuta del negozio in formato ISO 4217. Ad esempio, USD. Per maggiori dettagli, consulta l'attributo shop.currency.
Order
id	L'identificatore interno dell'ordine.
number	La rappresentazione con numero intero del nome dell'ordine. Ad esempio, 1025.
checkoutToken	L'identificatore interno del check-out.
customer	Il cliente associato all'ordine.
lineItem	Le voci dell'ordine.
subtotalPrice	Il prezzo subtotale di tutti gli articoli nell'ordine dopo l'applicazione degli sconti a livello di articolo e di carrello. Il subtotale non include le imposte (a meno che queste non siano incluse nei prezzi), i costi di spedizione o le mance.
totalPrice	Il prezzo totale dell'ordine.
currency	Il codice ISO 4217 della valuta dell'ordine.
discounts	La somma dell'importo degli sconti applicati all'ordine.
Customer
id	L'ID del cliente.
email	Indirizzo email del cliente.
acceptsMarketing	Indica se il cliente aveva accettato le comunicazioni di marketing. Sarà true se il cliente accetta le comunicazioni di marketing e false in caso contrario.
hasAccount	Indica se l'email del cliente è associata a un account cliente. Sarà true se l'indirizzo email è presente in un account cliente e false in caso contrario. Per maggiori dettagli, consulta l'attributo customer.has_account.
firstName	Nome del cliente.
lastName	Cognome del cliente.
ordersCount	Il numero totale di ordini effettuati dal cliente.
totalSpent	L'importo totale speso dal cliente per tutti gli ordini.
LineItem
finalLinePrice	Il prezzo complessivo di tutti gli articoli nella voce. Corrisponde a line_item.final_price moltiplicato per line_item.quantity.
finalPrice	Il prezzo della voce che include tutti gli importi degli sconti per voce.
lineLevelTotalDiscount	L'importo totale di tutti gli sconti applicati in modo specifico alla voce. Non include gli sconti aggiunti al carrello.
optionsWithValues	Una serie di valori selezionati dalle opzioni di prodotto dell'articolo. Per maggiori dettagli, consulta l'attributo line_item.options_with_values.
originalLinePrice	Il prezzo complessivo della quantità di articoli inclusi nella voce, prima dell'applicazione degli sconti. È uguale a line_item.original_price moltiplicato per line_item.quantity.
originalPrice	Il prezzo originale della voce prima dell'applicazione degli sconti.
price	Il prezzo unitario della voce. Il prezzo riflette gli eventuali sconti applicati alla voce. Disponibile solo per i negozi situati in Germania o in Francia.
product	Il prodotto della voce.
properties	Una serie di informazioni personalizzate per un articolo aggiunto al carrello. Per maggiori informazioni, consulta l'attributo line_item.properties.
quantity	La quantità della voce.
title	Il titolo della voce. Per maggiori informazioni, consulta l'attributo line_item.title.
variant	La variante della voce.
Product
id	L'ID del prodotto.
type	Il tipo di prodotto.
ProductVariant
id	L'ID della variante.
sku	La SKU della variante.
CartDiscount
id	L'identificatore interno dell'applicazione di sconto.
code	Il codice dello sconto, se esistente.
type	Il tipo di sconto. I valori possibili sono: automatic, discount_code, manual e script.
amount	L'importo totale dedotto dal prezzo di un ordine tramite sconto.