Passer au contenu principal

Installer Intercom pour les users sur le web

Installez le Messenger Intercom et commencez à converser avec vos users connectés.

Écrit par Eric Fitzgerald

L'installation du Messenger sur votre site web ne prend que quelques minutes. Une fois installé, vous pourrez accueillir, intégrer et assister les clients qui deviennent des users fidèles de votre application.

Les deux étapes nécessaires pour une installation complète et sécurisée du Messenger sont :

Vous aurez besoin d'un essai ou abonnement Intercom pour installer le Messenger.


Installation initiale du Messenger pour les users sur le web

Allez d'abord dans Paramètres > Canaux > Messenger > Installer et choisissez Installer pour le web.

Choisissez comment installer le Messenger

Sélectionnez la méthode d'installation parmi les options suivantes :

  • Extrait de code

  • React

  • Angular

  • Vue

  • Ember

  • WordPress

  • Google Tag Manager

  • Shopify

  • Segment

Chaque méthode fournit des étapes spécifiques une fois sélectionnée. Beaucoup offrent une installation via node package manager (NPM) pour vous faciliter la tâche.

Demandez l'aide de votre développeur (optionnel)

Si nécessaire, vous pouvez demander à un collègue (comme un ingénieur) de terminer l'installation. Cliquez simplement sur Inviter un collègue.

Une fois leur adresse e-mail saisie, une invitation leur sera envoyée pour rejoindre l'espace de travail de votre équipe.

Le collègue invité recevra un siège léger sur les plans Avancé / Expert et un siège complet sur les plans Essentiel. Il disposera des permissions minimales nécessaires pour installer le Messenger :

  • Peut gérer les paramètres généraux et de sécurité

  • Peut gérer les paramètres du Messenger

  • Peut gérer les données de l'espace de travail

Installez vous-même

Si vous avez choisi Extrait de code, React, Angular, Vue, Ember ou Shopify comme méthode d'installation, vous aurez le choix de compléter l'installation pour :

  • Pour les users avec connexion - Installez le Messenger pour les users connectés. Le Messenger affichera des informations comme les noms des clients et les conversations précédentes sur plusieurs appareils.

  • Pour les visiteurs du site sans connexion - Installez le Messenger pour les visiteurs anonymes qui ne sont pas connectés. Les conversations seront sauvegardées dans le navigateur via un cookie.

Nous recommandons d'installer le Messenger pour les users et les visiteurs.

Vous devez ensuite « Activer la connexion au messenger ».

Important : Si cette option est désactivée, toutes les requêtes vers Intercom échoueront. Les APIs du Messenger ne sont pas activées par défaut. Comme vous pouvez le voir en accédant à la page d'installation du Messenger, les exemples de code sont grisés tant que vous n'activez pas ce bouton. Cela active les APIs du Messenger pour votre espace de travail et garantit qu'il commence à accepter le trafic. Vous devrez activer cette option pour commencer à recevoir du trafic utilisateur.

Une fois votre Messenger configuré, nous recommandons également de le sécuriser avec des JWTs !

Installez Intercom via la méthode choisie

Suivez maintenant les instructions données pour la méthode sélectionnée. Par exemple, si vous avez choisi WordPress, vous verrez les instructions ci-dessous pour cette méthode.

Si vous avez choisi la méthode Extrait de code, React, Angular, Vue, ou Ember, un paquet NPM contenant un extrait de code à copier-coller dans la base de code de votre application vous sera fourni. Cet extrait est pré-rempli avec l'ID unique de votre espace de travail, il est donc prêt à l'emploi.

Vous pouvez aussi trouver le paquet directement sur le site NPM.

Plusieurs autres modèles sont disponibles, comme inclure l'extrait de code dans une application Node.js/Rails (Ruby)/Django (Python 3) ou PHP. Vous pouvez aussi inclure l'extrait dans une application monopage ou utiliser la gem rails pour l'installation. Pour les applications monopage (SPA), suivez le guide d'installation SPA pour gérer leur nature dynamique.

Cliquez sur Copier le code et collez-le avant la balise </body> sur chaque page où vous souhaitez que le Messenger apparaisse dans votre application.

Puis modifiez le code pour envoyer à Intercom l'adresse e-mail ou user_id et la date d'inscription de l'utilisateur actuellement connecté.

Après avoir ajouté le code, ouvrez votre application et le Messenger apparaîtra.

Fermez les sessions utilisateur lors de la déconnexion

Assurez-vous également d'appeler la méthode d'arrêt d'Intercom pour effacer les conversations de vos clients lorsqu'ils se déconnectent de votre application.

Tout user utilisant un ordinateur et un navigateur partagés avec quelqu'un d'autre pourra voir l'historique des conversations du dernier user connecté jusqu'à l'expiration du cookie. Pour cette raison, il est très important de fermer correctement Intercom lorsque la session d'un user sur votre application se termine (manuellement ou automatiquement).

Important :

  • Vous pouvez identifier les users avec soit un user_id soit une adresse e-mail.

  • Si vous envoyez un user_id et une adresse e-mail, le user_id aura la priorité pour identifier vos users.

  • Si vous choisissez d'utiliser user_id, l'adresse e-mail peut toujours être utilisée pour identifier vos users dans Intercom, donc nous recommandons d'activer la vérification d'identité.

  • Vous pouvez aussi envoyer à Intercom des attributs personnalisés sur vos users.

  • Si vous utilisez le CSS zoom sur votre page web, assurez-vous que les widgets d'Intercom ne le reçoivent pas.

Options d'apparence

La première option vous permet de choisir si vous souhaitez afficher ou masquer le messenger pour le public de votre site avant le lancement. Sinon, il est affiché par défaut.

La deuxième option renvoie aux Paramètres du Messenger, où vous pouvez changer les couleurs et le thème du messenger.

Vérifiez l'installation

Vous pouvez vérifier que l'installation a réussi en cliquant sur Vérifier l'installation. Ce bouton affiche une notification de succès si le Messenger est trouvé ou indique si un problème est survenu.

Si vous avez installé le Messenger Intercom et qu'il n'apparaît pas correctement, voici quelques solutions courantes. Le dépannage inclut aussi la vérification des restrictions du navigateur comme les bloqueurs de pub ou la navigation privée qui peuvent bloquer le Messenger, ainsi que l'évitement des domaines à suffixe public pour assurer une bonne visibilité.

Continuez maintenant à l'étape suivante de l'installation et sécurisez votre messenger avec des JWTs.

Note : Sans la sécurité du Messenger, vos users ne verront que les 14 derniers jours d'historique des conversations dans le Messenger. En savoir plus →


Installation d'Intercom pour un client

Si vous n'avez pas accès à l'espace de travail Intercom, vous pouvez récupérer le code JavaScript ici 👇 Vous devrez remplacer manuellement WORKSPACE_ID par l'ID unique de l'espace de travail de votre compte Intercom.

<script>
var APP_ID = "WORKSPACE_ID"; // Replace this with your workspace ID
window.intercomSettings = {
app_id: APP_ID,
name: "Jane Doe", // Full name
email: "customer@example.com", // Email address
created_at: 1312182000 // Signup date as a Unix timestamp
};
</script>
<script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + APP_ID;var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();</script>

La valeur pour created_at doit être la date à laquelle un client s'est inscrit à votre application, site ou service, envoyée sous forme de timestamp Unix.


Installation d'Intercom pour les espaces de travail hébergés en UE et AU

Pour installer Intercom si vous utilisez notre hébergement UE ou AU, vous devrez fournir un paramètre supplémentaire api_base. Les valeurs sont listées dans le tableau ci-dessous.

Région d'hébergement des données

Valeur api_base

États-Unis (US)

Union européenne (EU)

Australie (AU)


Installer Intercom dans un environnement de bureau

Il est techniquement possible d'inclure Intercom dans une application de bureau, cependant, nous ne supportons pas officiellement les environnements de bureau. Le Messenger Intercom a été conçu et développé pour fonctionner dans un environnement web (liste des navigateurs supportés). Ces environnements web supportent des fonctionnalités spécifiques dont notre Messenger dépend (ex. Javascript et CSS).

Electron et des technologies similaires vous permettent de créer des applications de bureau utilisant la technologie web, et il est possible d'installer Intercom dans ce type d'applications - il existe même des bibliothèques communautaires pour aider à installer Intercom dans les environnements Electron, cependant, ce n'est pas officiellement supporté.

Avez-vous trouvé la réponse à votre question ?