Tracciamento del commercio elettronico

Questa guida descrive come integrare manualmente il tracking e-commerce di Trackboxx in un negozio, indipendentemente dal fatto che si utilizzi un sistema personalizzato, Shopify, Shopware, Magento o un altro negozio. Per WooCommerce è disponibile un plugin ufficiale che attiva automaticamente tutti gli eventi qui descritti.

Logica di base: cosa fa trackboxx('Acquisto', [...])?

Prima di passare ai singoli eventi, è importante capire un punto che, secondo l'esperienza, viene interpretato molto spesso in modo errato:

Importante: trackboxx('Acquisto', [...]) è nessun evento singolo, ma la chiamata generica per tutte le interazioni di e-commerce. Quale evento viene effettivamente tracciato è determinato dall'opzione primo oggetto dell'array sul suo type:

• {Tipo: 'ViewProduct' } - Pagina di dettaglio del prodotto
• {Tipo: 'AddToCart'.} - Prodotto aggiunto al carrello
• {Tipo: 'ViewCart' } - Visualizza la pagina del carrello
• {Tipo: 'ordine'.} - Ordine completato

Il 'Acquisto' nella chiamata alla funzione indica semplicemente la categoria di azione „e-commerce“ e rimane sempre la stessa, indipendentemente dal fatto che si stia monitorando una visualizzazione del prodotto, un'aggiunta al carrello o un acquisto vero e proprio.

I quattro eventi di e-commerce in sintesi

1. viewProduct - pagina di dettaglio del prodotto

Innesco: Quando si richiama la pagina di dettaglio di un prodotto.
Dati minimi: Nome del prodotto e prezzo unitario.

<script>
trackboxx('Acquisto', [
  {tipo: Visualizza il prodotto },
  {tipo: 'prodotto', nome: '%%NOME_PRODOTTO%%'prezzo: 99.90 }
]);
</script>Lingua del codice: HTML, XML (xml)

Note:

• prezzo = Prezzo unitario del prodotto (numerico, punto come separatore decimale).
• Campi aggiuntivi facoltativi: sku, categoria.
• Per le varianti o i pacchetti: trasferire il nome completo della variante, compresi gli attributi (ad esempio, „T-shirt - rosso, L“), in modo che i rapporti siano aggregati in modo coerente.

2° AddToCart - prodotto aggiunto al carrello

Innesco: Dopo un successo „Processo “Aggiungi al carrello" - non cieco al clic.
Dati minimi: Nome del prodotto e prezzo unitario.

<script>
trackboxx('Acquisto', [
  {tipo: AddToCart' },
  {tipo: 'prodotto', nome: '%%NOME_PRODOTTO%%'prezzo: 19.99 }
]);
</script>Lingua del codice: HTML, XML (xml)

Note sulla tempistica - a seconda del tipo di negozio:

• Negozi personalizzati e cestini della spesa AJAX: L'evento viene generato nel callback di successo dell'azione Aggiungi al carrello, non nel gestore del clic. Ciò significa che non viene generato alcun evento di tracciamento se l'articolo non finisce nel carrello a causa di controlli di magazzino, errori di convalida o di rete.
• Negozi lato server con redirect: Attivare l'evento una volta nella pagina seguente dopo un'aggiunta riuscita.
• Integrazioni semplici con un clic: consentito, ma solo se si garantisce che il clic porti effettivamente a un'aggiunta andata a buon fine (ad esempio, controllo disabilitato dal pulsante per i prodotti esauriti).
• Deduplicazione: Inviare AddToCart una sola volta per azione, senza duplicazioni per il ricaricamento o la navigazione a ritroso.

3. viewCart - pagina del carrello della spesa

Innesco: Quando si richiama la pagina del carrello.
Dati minimi: Totale carrello (importo). Opzionale: tutti i prodotti inclusi come oggetti separati.

<script>
trackboxx('Acquisto', [
  {tipo: ViewCart' },
  {tipo: 'carrello', importo: 149.70 },
  {tipo: 'prodotto', nome: Prodotto A'prezzo: 99.90 },
  {tipo: 'prodotto', nome: Prodotto Bprezzo: 49.80 }
]);
</script>Lingua del codice: HTML, XML (xml)

Note:

• importo = importo totale del carrello. Standard: Rete (corrisponde al comportamento del plugin ufficiale di WooCommerce).
• Se il vostro negozio lavora con prezzi lordi, sono ammessi anche i valori lordi - il fattore decisivo è Coerenza all'interno di un evento: carrello.importo e tutti prodotto.prezzo-I valori devono essere calcolati sulla stessa base (tutto netto o tutto lordo).
• Una voce del carrello separata per ogni prodotto-Oggetto.
• Il prezzo per prodotto corrisponde alla Totale articolo (prezzo unitario × quantità) - si veda la sezione „Logica dei prezzi e quantità“.

4. acquisto - completamento dell'ordine (pagina di ringraziamento)

Innesco: Nella pagina di conferma dell'ordine dopo l'esito positivo del pagamento - esattamente una volta per ordine.
Dati minimi: ID ordine, importo totale, tutti i prodotti acquistati.

<script>
trackboxx('Acquisto', [
  {tipo: 'ordine', id: 'ID ORDINE', totale: 149.70 },
  {tipo: 'prodotto', nome: Prodotto A'prezzo: 99.90 },
  {tipo: 'prodotto', nome: Prodotto Bprezzo: 49.80 }
]);
</script>Lingua del codice: HTML, XML (xml)

Opzionale - con voucher: Un buono aggiuntivo per ogni buono utilizzato cedola-Oggetto.

<script>
trackboxx('Acquisto', [
  {tipo: 'ordine', id: '12345', totale: 149.70 },
  {tipo: 'coupon', nome: 'ESTATE10', sconto: 10.00 },
  {tipo: 'prodotto', nome: Prodotto A'prezzo: 99.90 },
  {tipo: 'prodotto', nome: Prodotto Bprezzo: 49.80 }
]);
</script>Lingua del codice: HTML, XML (xml)

Note:

• All'evento di acquisto sono presenti nessuno precedente, come nel caso di ViewProduct o AddToCart - il marcatore dell'evento ordine-oggetto identifica l'evento stesso.
• ordine.id = ID unico dell'ordine dal sistema del negozio.
• ordine.totale = valore totale dell'ordine (si consiglia l'importo finale lordo comprensivo di spese di spedizione e tasse, ma deve essere coerente con i valori di product.price).
• prodotto.prezzo = Totale articolo (prezzo unitario × quantità), non prezzo unitario.
• Protezione contro l'accensione multipla (protezione da ricarica), ad esempio tramite un flag lato server o un marcatore di sessione.

Logica di prezzo e quantità

Trackboxx utilizzato nessun separato quantità-Campo. Le quantità sono mappate implicitamente attraverso il prezzo. Questa regola è vincolante e deve essere implementata allo stesso modo in ogni integrazione:

Esempio: Tre articoli identici di 19,99 euro ciascuno nel carrello vengono venduti a Carrello e Acquisto come a prodotto-oggetto con prezzo: 59,97 inviati - non come tre oggetti separati e senza quantità-Campo.

Sequenza di oggetti nell'array

Per un'integrazione pulita e coerente, si consiglia la seguente sequenza di oggetti:

1. Marcatore di evento o. ordine-oggetto (Visualizza il prodotto / Aggiungi al carrello / Carrello / ordine)
2. carrello-oggetto (solo per ViewCart)
3. cedola-Oggetti (solo per l'Acquisto, se disponibile)
4. prodotto-Oggetti

Best Practice

• Deduplicazione: Inviare ogni evento una sola volta per ogni azione effettiva: nessun doppio tracciamento per il ricaricamento, la navigazione all'indietro o i ritorni AJAX.
• Tempi: Visualizza il prodotto e Carrello si accendono al caricamento della pagina. Aggiungi al carrello dopo l'aggiunta confermata. Acquisto una volta nella pagina di ringraziamento.
• Prezzi e importi: Come Numero (non una stringa), con un punto come separatore decimale (ad es. 19.99 - non "19,99").
• Coerenza: Netto o lordo è una decisione che spetta al singolo negozio - ma poi coerentemente per carrello.importo, prodotto.prezzo e ordine.totale.
• Protezione dei dati: Non consegnate mai dati personali: niente indirizzi e-mail, nomi, numeri di clienti o indirizzi. Rispettare il consenso.

Lista di controllo rapida per sistema di negozio

• WooCommerce: Utilizzare il plugin ufficiale Trackboxx. Innesca tutti e quattro gli eventi (Visualizza il prodotto, Aggiungi al carrello, Carrello, Acquisto) automaticamente, senza necessità di integrazione manuale.
• Negozi personalizzati: Sul lato server, inserire il nome del prodotto, il prezzo e il totale come variabili nei rispettivi script inline.
• Shopify: Inserite gli snippet nei modelli (prodotto.liquido, carrello.liquido, Checkout-Thank-You-Page). Per Aggiungi al carrello agganciarsi al callback di successo AJAX.
• Shopware / Magento: Collegarsi agli eventi o ai ganci corrispondenti nel tema o nel plugin: pagina del prodotto, pagina del carrello, evento add-to-cart, evento di completamento dell'ordine.

Riferimento: Varianti minimali

VisualizzaProdotto (minimo)

trackboxx('Acquisto', [
  { type: Visualizza il prodotto },
  { type: 'prodotto', nome: Nome prodotto 1, prezzo: 19.99 }
]);Lingua del codice: JavaScript (javascript)

AddToCart (minimo)

trackboxx('Acquisto', [
  { type: AddToCart' },
  { type: 'prodotto', nome: Nome prodotto 1, prezzo: 19.99 }
]);Lingua del codice: JavaScript (javascript)

ViewCart (minimo)

trackboxx('Acquisto', [
  { type: ViewCart' },
  { type: 'carrello', importo: 19.99 }
]);Lingua del codice: JavaScript (javascript)

Acquisto (minimo)

trackboxx('Acquisto', [
  { type: 'ordine', id: 'ID ORDINE', totale: 19.99 },
  { type: 'prodotto', nome: Nome prodotto 1, prezzo: 19.99 }
]);Lingua del codice: JavaScript (javascript)

Breve panoramica: Le regole più importanti

• trackboxx('Acquisto', [...]) è una chiamata generica al commercio elettronico, non un evento.
• Il tipo di evento è nel payload (type-del primo oggetto), non nella chiamata di funzione.
• Aggiungi al carrello si attivano dopo un'aggiunta andata a buon fine, non alla cieca quando si fa clic.
• carrello.importo come valore netto per impostazione predefinita; il lordo è consentito, ma è coerente con l'evento.
• prezzo = Prezzo unitario a Visualizza il prodotto / Aggiungi al carrello, totale articoli per Carrello / Acquisto.
• Non c'è una parte separata quantità-campo - quantità tramite il prezzo.
• Evento di acquisto basato su {Tipo: 'ordine'.} senza un marcatore di evento precedente.
• Prezzi come numero con separatore decimale a punti, mai come stringa.
• Nessun dato personale nel payload.