Monitoraggio delle conversioni Trackboxx

Con il Conversion Tracking di Trackboxx puoi misurare quali azioni compiono i visitatori sul tuo sito web, ad esempio clic su link importanti, moduli inviati o visualizzazioni di determinate pagine.
Questi dati ti aiutano a valutare con precisione il successo delle tue attività di marketing e del tuo sito web.

Importante: Trackboxx offre anche la possibilità di monitorare automaticamente conversioni e obiettivi. Questo metodo è molto più semplice e non richiede codice aggiuntivo sul tuo sito web. Leggi l’articolo: Obiettivi automatici

Quali tipi di conversione può registrare Trackboxx?

Trackboxx supporta i seguenti eventi:

• Clic su link, pulsanti o voci di menu
• Visite a determinate pagine (ad es. una pagina di ringraziamento)
• Invio del modulo
• Eventi JavaScript personalizzati

Ogni conversione viene visualizzata nella dashboard con i seguenti dati:

• Nome del progetto
• Numero di scatti
• Valore (facoltativo)
• Tasso di conversione nel periodo selezionato

1. Creare una conversione

Come creare un nuovo obiettivo:

1. Clicca sull'icona a forma di ingranaggio in alto a destra
2. Seleziona siti web
3. Seleziona il sito web e clicca su Obiettivi
4. Clicca su Creare un obiettivo
5. Assegna nome e descrizione
6. Riceverai un codice simile a questo:

Questo ID di base verrà successivamente integrato negli esempi di codice appropriati.

2. Monitoraggio dei clic

Puoi tracciare i clic in diversi modi.
Trackboxx consiglia la variante JavaScript, poiché è più stabile, flessibile e conforme al GDPR.

2.1 Monitoraggio dei clic tramite JavaScript

a) Tracciamento tramite un ID CSS

<a href="/kontakt/" id="kontakt-link">Kontakt</a>
Lingua del codice: HTML, XML (xml)

Codice di tracciamento:

<script>
document.getElementById('kontakt-link').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lingua del codice: HTML, XML (xml)

b) Tracciamento tramite una classe CSS

<script>
document.querySelector('.kontakt-link').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>Lingua del codice: HTML, XML (xml)

⚠️ Avviso:
querySelector() traccia solo il primo elemento con questa classe.

Per più elementi contemporaneamente:

<script>
document.querySelectorAll('.kontakt-link').forEach(el => {
    el.addEventListener('click', () => {
        trackboxx('trackGoal', 'DEINE-ID');
    });
});
</script>
Lingua del codice: HTML, XML (xml)

2.2 Tracciamento dei clic con reindirizzamento immediato (link esterni, download, mailto, tel)

Se un link fa uscire il visitatore dalla pagina immediatamente, il browser potrebbe non avere il tempo di inviare il segnale di tracciamento.

Soluzione:
► Ritarda brevemente il reindirizzamento e prosegui solo dopo l’invio del segnale di tracciamento .

Esempio:

<script>
document.querySelectorAll('.externer-link').forEach(el => {
  el.addEventListener('click', (e) => {
    e.preventDefault();
    trackboxx('trackGoal', 'DEINE-ID');
    setTimeout(() => {
      window.location = el.href;
    }, 150);
  });
});
</script>
Lingua del codice: HTML, XML (xml)

Consigliato per:

• collegamenti esterni
• Download PDF
• Link Mailto
• Tel-Links
• Link di affiliazione

2.3 Tracciamento dei clic tramite HTML inline (onclick)

Questo metodo funziona, ma non è ottimale:

<a href="/kontakt/" onclick="trackboxx('trackGoal', 'DEINE-ID');">Kontakt</a>
Lingua del codice: HTML, XML (xml)

⚠️ Svantaggi:

• più difficile da gestire
• viene spesso sovrascritto dai page builder
• tecnicamente meno affidabile

Raccomandazione: JavaScript invece che inline.

3. Visualizzazioni di pagina (conversioni di visualizzazioni di pagina)

Per misurare la frequenza con cui viene visualizzata una determinata pagina:

<script>
document.addEventListener('DOMContentLoaded', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lingua del codice: HTML, XML (xml)

Ideale per:

• Pagine di ringraziamento
• Conferme d'ordine
• Pagine di conferma dopo l’invio di un modulo

4. Monitoraggio dei moduli

Ci sono quattro modi:

4.1 Monitorare il modulo tramite onsubmit (se l'accesso è possibile)

<form onsubmit="trackboxx('trackGoal', 'DEINE-ID');">
Lingua del codice: HTML, XML (xml)

Semplice: funziona ovunque sia possibile modificare l'HTML.

4.2 Monitoraggio dell'invio dei moduli tramite JavaScript

Se è necessario eventListener:

<script>
document.querySelector('#kontaktformular').addEventListener('submit', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lingua del codice: HTML, XML (xml)

4.3 Sistemi di moduli con logica di successo propria (ad es. smart builder)

<script>
sk('form', 'init', {
  onSuccess: function() {
    trackboxx('trackGoal', 'DEINE-ID');
  }
});
</script>
Lingua del codice: HTML, XML (xml)

→ Funziona con gli strumenti che dispongono di un proprio hook “success”.

4.4 Tracciamento tramite pagina di ringraziamento (soluzione alternativa)

Se nessuna di queste soluzioni funziona:

1. Modulo inviato con successo
2. Reindirizzamento alla nuova pagina (ad es. /grazie/)
3. Utilizzare il codice di tracciamento delle visualizzazioni di pagina su questa pagina

Questa è la soluzione più universale.

5. Monitoraggio specifico per WordPress

5.1 Tracciamento dei clic sul menu tramite classe CSS

Ad esempio, assegna questa classe CSS a una voce di menu di WordPress:

CSS-Klasse: neu-hier
Lingua del codice: HTTP (http)

Monitoraggio:

<script>
document.querySelector('.neu-hier').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lingua del codice: HTML, XML (xml)

Generatore automatico di codici di conversione

// Inserisci prima il tuo ID di conversione.

Articoli correlati:

Monitorare Google Ads / Facebook Ads tramite UTM – In questo articolo ti mostriamo come monitorare e valutare le tue campagne a pagamento su Google o Meta/Facebook con Trackboxx.