Avertissement : cet article est le résultat de la traduction automatique, l'exactitude et la fidélité de la traduction ne sont donc pas garanties. Pour consulter la version originale de cet article, en anglais, cliquez ici.
Tracking Code

Installer le code de suivi HubSpot

Dernière mise à jour: octobre 19, 2020

Disponible avec :

Tous les produits et les abonnements

Le code de suivi HubSpot est unique à chaque compte HubSpot et permet à HubSpot de surveiller le trafic de votre site web. Le code de suivi est automatiquement inclus dans les articles de blog, les pages de destination et les pages de site web HubSpot.

Si vous disposez de pages hébergées en externes (autrement dit, des pages hors HubSpot), vous devez installer le code de suivi HubSpot pour capturer les analytics pour ces pages. 

Remarque :

Copier votre code de suivi HubSpot

  • Depuis votre compte HubSpot, accédez à l'icône Paramètres settings dans l'angle supérieur droit.
  • Accédez aux Suivi et d'analyse des rapports :
    • Pour les comptes Hub Marketing Starter et CRM gratuits, accédez au Code de suivi dans le menu latéral de gauche.
    • Pour tous les autres abonnements, accédez à Suivi et analytics > Code de suivi dans le menu latéral de gauche.
  • Dans la section Intégrer le code, cliquez sur Copier ou bien sur Envoyer un e-mail à mon développeur web pour envoyer le code de suivre au membre de l'équipe qui l'installera sur votre site.

    copy-tracking-code
  • Installez le code de suivi sur votre site web.

Installer le code de suivi sur votre site web

Pour installer le code de suivi, collez le code juste avant la balise de fermeture </body> dans le code HTML de chaque page de votre site. Une fois le code de suivi installé, découvrez comment vérifier l'installation et résoudre les problèmes de code.

En parallèle, la plupart des systèmes de gestion de contenu ainsi que vos développeurs peuvent installer le code sur toutes les pages de votre site, comme un fichier de pied de page qui apparaît sur toutes les pages. Contactez vos développeurs pour savoir comment ils peuvent effectuer cette action.

Les sections suivantes peuvent également vous aider si vous utilisez un système de gestion de contenu spécifique.

Remarque : Chaque site web étant structuré différemment, ces étapes peuvent ne pas être des instructions précises d'accès à votre code HTML. Si vous n'êtes pas sûr de la façon d'accéder au code HTML de votre site, contactez votre webmaster, votre service informatique ou votre développeur et faites-lui lire cet article.
 

Installer le code de suivi sur un site web WordPress

Nous vous recommandons vivement d'installer et utiliser le plug-in HubSpot tout-en-un Marketing-Formulaires, Pop-ups, Chat en direct WordPress. Ce plug-in installe automatiquement le code de suivi HubSpot sur votre site WordPress.

Si vous ne pouvez pas installer le plug-in HubSpot WordPress :

  • Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot.
  • Connectez-vous à votre compte WordPress.
  • Dans le menu latéral de gauche, accédez à Apparence > Éditeur.
  • Dans la liste des fichiers de thème sur la droite de l'éditeur, sélectionnez votre pied de page.
  • Collez le code de suivi et sélectionnez Mettre à jour le fichier.

Remarque :
  • Si vous installez manuellement le code de suivi et que vous disposez d'un abonnement Hub Marketing, HubSpot ne sera pas en mesure de différencier les articles WordPress des pages d'analyse.
  • Si votre site est hébergé sur WordPress.com, vous ne pourrez pas ajouter le code de suivi HubSpot à votre site web à moins que vous ne bénéficiiez de leur plan Business. Les autres plans (par exemple Premium, personnel) ne permettent pas aux utilisateurs d'ajouter un code JavaScript.

Installez le code de suivi sur un site Shopify

Remarque : Si vous utilisez l'intégration Shopify, il n'est pas nécessaire d'installer séparément le code de suivi.

  • Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot.
  • Connectez-vous à votre tableau de bord d'administrateur Shopify.
  • Dans le menu latéral de gauche, accédez à Boutique en ligne > Thèmes.
  • Cliquez sur le menu déroulant Actions et sélectionnez Modifier le code.
  • Sélectionnez le fichier theme.liquid pour votre thème.

  • Collez votre code de suivi HubSpot juste avant la balise </body> dans ce fichier.
  • Dans l'angle supérieur droit, cliquez sur Enregistrer.

 

Installez le code de suivi sur un site Drupal

  • Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot.
  • Connectez-vous à votre tableau de bord d'administrateur Drupal.
  • Dans le menu de navigation principal, accédez à Structure.
  • Cliquez sur Blocs.

  • Cliquez sur + Ajouter un bloc.
  • Saisissez les champs pour votre nouveau bloc. Collez le code de suivi dans le champ du corps du bloc, puis cliquez sur Enregistrer le bloc.

 

Installer le code de suivi sur un site Magento

Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot. Suivez ensuite le guide de conception de Magento pour obtenir des instructions sur l'installation du code JavaScript tiers dans le lien HTML d'en-tête.

 

Installer le code de suivi sur un site Wix

Utilisez le marché d'application dans Wix pour ajouter un widget HTML à votre page :

  • Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot.
  • Accédez à votre gestionnaire de site.
  • Dans le menu latéral de gauche, accédez à Suivi et analytics.
  • Cliquez sur personnaliser ou Ajouter un nouvel outil > Personnaliser.
  • Collez le code de suivi dans le champ Coller le bloc de code ici.
  • Définissez le Nom du nouvel outil du code de suivi de HubSpot.
  • Dans Ajouter un code aux pages, cliquez sur le bouton radio de Toutes les pages et utilisez le pour pour sélectionner le Code de chargement sur chaque nouvelle page.
  • Dans Code de position dans la section, cliquez sur le bouton radio de l'option Corps - Fin.
  • Cliquez sur Appliquer pour enregistrer les modifications.
Si vous utilisez un chat en direct ou un bot sur votre site Wix, vous pouvez suivre les étapes ci-dessus pour ajouter le chatflow à chaque page ou vous pouvez travailler avec un développeur pour utiliser le SDK du widget de chat en ciblant des pages spécifiques. Utilisez la méthode .widget-refresh pour distinguer les chatflows selon les pages. Découvrez-en davantage sur la documentation pour les développeurs de HubSpot. 
 

Installer le code de suivi sur un site Joomla

Il existe deux façons d'ajouter le code de suivi HubSpot sur votre site Joomla. Dans les deux cas, vous devez d'abord copier le code de suivi HubSpot en suivant les étapes ci-dessus.

Vous pouvez sélectionner une extension dans l'annuaire de Joomla, où vous pourrez coller le code de suivi HubSpot. Vous avez également la possibilité de suivre les étapes ci-dessous pour installer le code de suivi :

  • Connectez-vous à votre compte Joomla en tant qu'administrateur.
  • Dans le menu de navigation principal, accédez à Extensions > Modèles > Modèles.
  • Cliquez sur le nom du modèle et sélectionnez index.php dans le menu latéral de gauche.
  • Collez le code de suivi HubSpot directement au-dessus de la balise </body>.
  • Cliquez sur Enregistrer.

 

Installer le code de suivi sur un site Squarespace

  • Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot.
  • Connectez-vous à votre compte Squarespace.
  • Dans le menu latéral de gauche, accédez à Paramètres.
  • Dans la section Site web du menu, accédez à Avancé, puis sélectionnez Injection de Code.
  • Collez le code de suivi dans le champ Titre.
  • Dans l'angle supérieur gauche, cliquez sur Enregistrer.

 

Installer le code de suivi en utilisant Google Tag Manager

  • Suivez les étapes ci-dessus pour copier le code de suivi HubSpot dans votre compte HubSpot.
  • Dans un nouvel onglet ou une nouvelle fenêtre, connectez-vous à votre compte Google Tag Manager.
  • Sélectionnez votre conteneur.
  • Dans le menu latéral de gauche, accédez à Balises.
  • Cliquez sur Nouveau.

  • Cliquez sur Configuration de la balise.
  • Pour le type de balise, choisissez Balise HTML personnalisée. Puis, donnez un nom à votre balise.
  • Collez le code de suivi dans le champ HTML.
  • Dans Configuration de la balise, cliquez sur Déclenchement afin de définir la règle de déclenchement. Si aucune règle de déclenchement n'est définie, la balise ne sera pas déclenchée et les analytics HubSpot ne seront pas collectés.
  • Afin que la balise soit déclenchée pour toutes les pages où le code Google Tag Manager a été installé (recommandé), sélectionnez l'option Toutes les pages.

  • Cliquez sur Enregistrer pour enregistrer la nouvelle balise.
  • Dans l'angle supérieur droit, cliquez sur Publier le conteneur et les balises.

Code supplémentaire pour classer les données selon le type de page HubSpot

Si vous utilisez des rapports d'attribution de création de contacts, des rapports d'attribution du chiffre d'affaires ou l'onglet Pages dans l'outil Analytics de trafic et que vous souhaitez classer les données des visiteurs de vos pages externes selon le type de page, vous devez demander à votre équipe développeurs d'ajouter le code suivant à vos pages :
 
var _hsq = window._hsq = window._hsq || [];
_hsq.push(['setContentType', 'CONTENT_TYPE']);

Remplacez le texte CONTENT_TYPE dans le code avec l'expression pour le type de contenu auquel vous souhaitez attribuer les crédits.

  • Pour attribuer des crédits au type de contenu Page de site web, utilisez les expressions standard-page ou site-page.
  • Pour attribuer des crédits au type de contenu Page de destination, utilisez l'expression landing-page.
  • Pour attribuer des crédits au type de contenu Page de listing, utilisez l'expression listing-page.
  • Pour attribuer des crédits au type de contenu Article de blog, utilisez l'expression blog-post.
  • Pour attribuer des crédits au type de contenu Article de la base de connaissances, utilisez l'expression knowledge-article.

Une fois ajoutées, les données relatives à votre page externe seront classées selon le type de page que vous avez sélectionné dans le code. Découvrez le fonctionnement de ce code dans la documentation pour les développeurs.