web-dev-qa-db-fra.com

Suivi des clics sur les liens avec Google Analytics?

Je suis un débutant complet avec Google Analytics, et j'ai besoin de savoir comment le configurer pour qu'il puisse suivre le nombre de clics qu'un lien sur mon site Web obtient?

Par exemple, j'ai un lien:

<a href="https://google.com">link</a>

Je sais que je suis censé mettre un événement onClick quelque part, mais je ne sais pas comment il est lié à Google Analytics?

Est-ce le bon code Onclick:

onClick="_gaq.Push(['_trackEvent', 'Link', 'Click', 'Banner Advert1']);"
37
user3191726

Vous souhaitez probablement utiliser le suivi des événements - il s'agit d'une simple fonction Javascript qui peut être déclenchée à partir de l'événement de clic sur vos liens. Vous devrez vous assurer que vous disposez également du script de suivi Google standard sur votre page.

De Guide de suivi des événements Google

Le suivi des événements est une méthode disponible dans le code de suivi ga.js que vous pouvez utiliser pour enregistrer l'interaction de l'utilisateur avec des éléments de site Web, comme un système de menus Flash. Pour ce faire, attachez l'appel de méthode à l'élément d'interface utilisateur particulier que vous souhaitez suivre. Lorsqu'il est utilisé de cette façon, toutes les activités des utilisateurs sur ces éléments sont calculées et affichées en tant qu'événements dans l'interface de création de rapports Analytics. En outre, les calculs de consultation de page ne sont pas affectés par l'activité des utilisateurs suivie à l'aide de la méthode de suivi des événements. Enfin, le suivi des événements utilise un modèle orienté objet que vous pouvez utiliser pour collecter et classer différents types d'interaction avec vos objets de page Web.

Exemple:

<a href="www.google.com" onclick="_gaq.Push(['_trackEvent', 'Google Link', 'Action label', 'Additional info']);">link</a>

[~ # ~] mise à jour [~ # ~]

Ce qui précède est pour l'ancienne version de l'API - ga.js. Si vous utilisez le plus récent suivi universel veuillez vous référer à la documentation . En effet, les données transmises sont les mêmes qu'avant, mais l'appel est différent.

Exemple de suivi d'événements à l'aide de la nouvelle API:

<a href="www.google.com" onclick="ga('send', 'event', 'Google Link', 'Action label', 'Action Value');">link</a>
38
geedubb

Veuillez noter que _gaq.Push(..) fait référence au suivi avec l'héritage Suivi Web Classic Analytics (ga.js). La nouvelle norme Suivi Web Universal Analytics (analytics.js) utilise une méthodologie différente comme:

ga('send', 'event', 'button', 'click', 'nav buttons', 4);

Les deux premières options ne peuvent pas être modifiées, elles transmettent l'option send avec le type de hit event à la fonction ga.

Les deux options suivantes sont également requises, les deux dernières sont facultatives. Ils représentent:

  • button (chaîne | obligatoire): Catégorie
  • click (chaîne | obligatoire): Action
  • nav buttons (chaîne | non obligatoire): Libellé
  • 4 (Entier positif | non requis): Valeur

Plus d'informations peuvent être trouvées sur: https://developers.google.com/analytics/devguides/collection/analyticsjs/events

29
AnuragBabaresco

Les autres réponses ne tiennent pas compte du fait que la demande peut ne pas être terminée avant que la page ne change , ce qui empêche l'enregistrement de l'événement.

C'est le problème avec cette solution trouvée dans d'autres réponses:

 <a
    href="http://example.com"
    onclick="ga('send', 'event', {eventAction: 'click', eventCategory: 'Example'})"
 >example</a>

La documentation de Google Analytics fournit ne solution à cela :

Le suivi des liens et des formulaires sortants peut être délicat car la plupart des navigateurs cessent d'exécuter JavaScript sur la page actuelle une fois qu'une nouvelle page commence à se charger. Une solution à ce problème consiste à définir le champ transport sur beacon

beacon le transport permet d'envoyer des données de manière asynchrone à un serveur, même après la fermeture d'une page.

Ajouter transport: 'beacon', comme ça:

 <a
    href="http://example.com"
    onclick="ga('send', 'event', {transport: 'beacon', eventAction: 'click', eventCategory: 'Example'})"
 >example</a>

Malheureusement, certains navigateurs ne prennent pas en charge les balises, notamment IE 11 (caniuse) . Pour contourner ce problème, vous pouvez annuler la navigation sur la page =, envoyez la demande à Google Analytics, attendez qu'elle soit terminée, puis lancez la navigation sur la page. Heureusement, tous les principaux navigateurs modernes la prennent en charge.

16
Flimm

Je l'utilise dans le pied de page de chaque mise en page en tant qu'événement dans Google Goals.

Échangez le registre avec le slug pour le chemin de page avant la page de réussite.

<script>

  window.addEventListener('load',function(){

    if(window.location.pathname =="/register/" )

    {

      ga('send','event','register page','referrer',document.referrer)

    }

  });

</script>

Ensuite, dans Admin> Objectifs

  1. Douane
  2. Description de l'objectif

enter image description here

  1. Détails de l'objectif

enter image description here

Cela vous permet de suivre l'URL de la page sur laquelle le lien a été cliqué si cela a abouti à la réussite de l'objectif.

Accédez à Comportement> Événements> Aperçus des rapports de données.

7
Dev

Je vois que les autres réponses se réfèrent à l'ancienne syntaxe: ga(). Ce qui ne fonctionnera pas si vous utilisez la dernière version du suivi Google Analytics ...

Voici un exemple de suivi d'événements à l'aide de la dernière version GA version gtag():

<a href="http://example.com" onclick="gtag('event', 'click', {'event_category': 'Navbar button', 'event_label': 'Navbar blue Download button'});">Download</a>

C'est donc notre onclick contenu d'attribut:

gtag('event', 'click', {'event_category': 'Navbar button', 'event_label': 'Navbar blue Download button'});

Le script ci-dessus a les options suivantes:

  • Type de hit (Event | Obligatoire): Ne peut pas être modifié
  • Action d'événement (Texte | Obligatoire): Le type d'interaction (par exemple, 'click')
  • event_Category (Text | Required): Typiquement l'objet avec lequel on a interagi (par exemple 'Navbar button ')
  • event_label (Texte | Facultatif): Utile pour catégoriser les événements (par exemple 'Navbar blue Download button ')

Plus de détails: https://developers.google.com/analytics/devguides/collection/gtagjs/migration#track_events

3
ExillustX