Suivi des conversions Trackboxx

Grâce au suivi des conversions de Trackboxx, vous pouvez mesurer les actions effectuées par les visiteurs sur votre site web, par exemple les clics sur des liens importants, les formulaires envoyés ou les consultations de certaines pages.
Ces données vous aident à évaluer avec précision le succès de vos mesures marketing et de votre site web.

Quels types de conversions Trackboxx peut-il enregistrer ?

Trackboxx prend en charge les événements suivants :

• Clics sur des liens, des boutons ou des entrées de menu
• Consultations de certaines pages (par exemple, une page de remerciement)
• envoi de formulaires
• Événements JavaScript personnalisés

Chaque transaction est affichée dans le tableau de bord avec les informations suivantes :

• Nom du projet cible
• Nombre de déclenchements
• Valeur (facultatif)
• Taux de conversion pendant la période sélectionnée

1. Créer une conversion

Voici comment créer un nouvel objectif :

1. Cliquez sur la roue dentée en haut à droite.
2. Sélectionner sites web
3. Sélectionne le site web et clique sur objectifs
4. Cliquez sur Créer un projet cible
5. Attribuer un nom et une description
6. Vous recevrez un code comme celui-ci :

Cet identifiant de base sera intégré ultérieurement dans les exemples de code correspondants.

2. Suivi des clics

Vous pouvez suivre les clics de différentes manières.
Trackboxx recommande la Variante JavaScript, car elle est plus stable, plus flexible et plus conforme au RGPD.

2.1 Suivi des clics via JavaScript

a) Suivi via un identifiant CSS

<a href="/contact/" id=" lien de contact ">Contact</a>
Langage du code : HTML, XML (xml)

Code de suivi :

<script>
document.getElementById('lien de contact).addEventListener('click, () => { trackboxx('trackGoal' (piste), ' TON-ID ');
});
</script>
Langage du code : HTML, XML (xml)

b) Suivi via une classe CSS

<script>
document.querySelector('.lien-contact).addEventListener('click, () => { trackboxx('trackGoal' (piste), ' TON-ID ');
});
</script>Langage du code : HTML, XML (xml)

⚠️ Remarque :
querySelector() suit seulement le premier élément avec cette classe.

Pour plusieurs éléments à la fois :

<script>
document.querySelectorAll('.lien-contact).forEach(el => { el.addEventListener('click, () => { trackboxx('trackGoal' (piste), ' TON-ID ');
    });
});
</script>
Langage du code : HTML, XML (xml)

2.2 Suivi des clics avec redirection immédiate (liens externes, téléchargements, mailto, tél.)

Si un lien renvoie à la page quitte immédiatement, le navigateur ne peut parfois pas envoyer le suivi à temps.

Solution :
► Retarder brièvement le transfert et seulement après le suivi Exécuter.

exemple :

<script>
document.querySelectorAll('.lien externe').forEach(el => { el.addEventListener('click, (e) => { e.preventDefault(); trackboxx('trackGoal' (piste), ' TON-ID '); setTimeout(() => {
      window.location = el.href ; }, 150);
  });
});
</script>
Langage du code : HTML, XML (xml)

Recommandé pour :

• liens externes
• Téléchargements PDF
• Liens Mailto
• Liens téléphoniques
• Liens d'affiliation

2.3 Suivi des clics via HTML intégré (onclick)

Cette méthode fonctionne, mais n'est pas optimale :

<a href="/contact/" onclick=" trackboxx('trackGoal', 'VOTRE-ID') ; ">Contact</a>
Langage du code : HTML, XML (xml)

⚠️ Inconvénients :

• moins facile à entretenir
• est souvent écrasé par les constructeurs de pages
• techniquement incorrect

Recommandation : JavaScript au lieu d'inline.

3. Consultations de pages (conversions de pages vues)

Pour mesurer la fréquence à laquelle une page donnée est consultée :

<script>
document.addEventListener(' DOMContentLoaded ', () => { trackboxx('trackGoal' (piste), ' TON-ID ');
});
</script>
Langage du code : HTML, XML (xml)

Idéal pour :

• Pages de remerciements
• Confirmations de commande
• Pages « Envoi réussi »

4. Suivi des formulaires

Il existe trois façons :

4.1 Contrôler le formulaire via onsubmit (si l'accès est possible)

<formulaire onsubmit=" trackboxx('trackGoal', 'VOTRE-ID') ; ">
Langage du code : HTML, XML (xml)

Simple – fonctionne partout où le HTML peut être édité.

4.2 Suivi de l'envoi des formulaires via JavaScript

Si eventListener est nécessaire :

<script>
document.querySelector(' Formulaire de contact # ').addEventListener(' soumettre ', () => { trackboxx('trackGoal' (piste), ' TON-ID ');
});
</script>
Langage du code : HTML, XML (xml)

4.3 Systèmes de formulaires avec leur propre logique de réussite (par exemple, générateurs intelligents)

<script>
sk('form, 'init' (en anglais), {
  onSuccess : fonction() { trackboxx('trackGoal' (piste), ' TON-ID ');
  }
});
</script>
Langage du code : HTML, XML (xml)

→ Correct pour les outils qui possèdent leur propre hook „ success “.

4.4 Suivi via la page de remerciement (solution de repli)

Si rien de tout cela ne fonctionne :

1. Formulaire envoyé avec succès
2. Redirection vers une nouvelle page (par exemple /merci/)
3. Utiliser le code de suivi des pages vues sur cette page

C'est la solution la plus universelle.

5. Suivi spécifique à WordPress

5.1 Suivi des clics dans les menus via la classe CSS

L'entrée de menu WordPress reçoit par exemple :

Classe CSS: nouveau ici
Langage du code : HTTP (http)

Suivi :

<script>
document.querySelector('.nouveau-ici).addEventListener('click, () => { trackboxx('trackGoal' (piste), ' TON-ID ');
});
</script>
Langage du code : HTML, XML (xml)

Générateur automatique de code de conversion

// Veuillez d'abord saisir votre identifiant de conversion.

Articles complémentaires :

Suivi des publicités Google Ads / Facebook Ads via UTM – Dans cet article, nous vous montrons comment suivre et évaluer vos campagnes payantes sur Google ou Meta/Facebook avec Trackboxx.