Utilisez cet article pour installer Intercom Messenger sur votre site web, connecter vos données clients en toute sécurité et tester que tout fonctionne. Une fois installé, vous pourrez accueillir, intégrer et soutenir les clients qui deviendront des users fidèles de votre application.
Les étapes pour une installation complète et sécurisée de Messenger sont :
Choisissez votre type d'installation.
Installez et testez Messenger.
Connectez vos données clients et sécurisez Messenger (ignorez cette étape si vous avez choisi Visitors & leads uniquement).
Note : Il s'agit de la nouvelle expérience d'installation de Messenger, qui est déployée progressivement. Si votre espace de travail n'a pas encore été basculé, utilisez plutôt Installer Intercom pour visitors et leads sur le web ou Installer Intercom pour users sur le web.
Choisissez votre type d'installation
Allez dans Paramètres > Canaux > Messenger Live Chat > Vue d'ensemble, trouvez la carte Website et sélectionnez Installer sur le site web.
Sélectionnez votre type d'installation
On vous demandera « Quelles informations votre équipe a-t-elle besoin de recevoir dans votre inbox ? » et deux options vous seront présentées :
Visitors & leads (le plus rapide à installer) — Les conversations ne sont pas liées aux détails des users. Vous pouvez compléter la configuration supplémentaire plus tard pour identifier les users connectés.
Signed-in users, visitors & leads — Les conversations des users connectés incluent les détails pertinents, donnant à votre équipe le contexte nécessaire pour fournir un support personnalisé. Nécessite des modifications frontend et backend.
Chaque carte montre un aperçu de ce que votre équipe verra dans l'Inbox pour cette option, afin que vous puissiez comparer avant de vous engager. Sélectionnez l'option qui correspond à votre entreprise, puis cliquez sur Continuer.
Astuce : Visitors & leads vous permet de configurer rapidement. Vous pouvez toujours revenir plus tard et compléter la configuration Signed-in users, visitors & leads quand votre équipe sera prête.
Demandez l'aide d'un développeur (optionnel)
Si nécessaire, vous pouvez demander à un coéquipier — comme un ingénieur — de terminer l'installation. Cliquez sur Inviter un coéquipier, saisissez son adresse e-mail, et une invitation lui sera envoyée pour rejoindre votre espace de travail avec les permissions minimales requises pour installer Messenger :
Peut gérer les paramètres généraux et de sécurité
Peut gérer les paramètres de Messenger
Peut gérer les données de l'espace de travail
Choisissez comment installer Messenger
Sélectionnez la méthode d'installation souhaitée parmi les options suivantes :
Utilisation de code personnalisé
Extrait de code
React
Angular
Vue
Ember
Ou via l'une des intégrations suivantes
WordPress
Google Tag Manager
Shopify
Segment
Cliquer sur l'une de ces options la sélectionne et révèle les étapes spécifiques pour cette méthode. Beaucoup de ces méthodes proposent une installation via Node.js Package Manager (NPM) pour faciliter le processus.
Note : Pour les applications monopage (SPA), l'approche standard de l'extrait de code nécessite un ajustement. Suivez le guide d'installation SPA d'Intercom pour gérer correctement les changements dynamiques de page.
Installez Intercom via la méthode choisie
Suivez maintenant les instructions données pour la méthode sélectionnée. Si vous avez choisi Extrait de code, React, Angular, Vue, ou Ember, un extrait de code référant un paquet NPM vous sera fourni. Cet extrait est pré-rempli avec l'ID unique de votre espace de travail, il est donc prêt à l'emploi.
Cliquez sur Copier le code et collez-le avant la balise </body> sur chaque page où vous souhaitez que Messenger apparaisse.
Puis modifiez le code pour envoyer à Intercom l'adresse e-mail ou user_id et la date d'inscription de l'user actuellement connecté :
var APP_ID = "your_app_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
};Après avoir ajouté le code, ouvrez votre application et Messenger apparaîtra.
Important : Gardez les points suivants à l'esprit lors de l'identification des users :
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.
Passez toujours user_id, e-mail et user_hash dynamiquement depuis votre serveur pour l'user actuellement connecté — ne codez jamais en dur ni ne mettez en cache l'identité d'un seul user dans l'extrait.
Testez votre installation
Cliquez sur Tester votre installation pour confirmer que Messenger fonctionne comme prévu.
Une fois le test réussi, vous verrez une confirmation « Messenger est installé ».
Pour le chemin Visitors & leads, le message est : « Les visitors peuvent maintenant démarrer des conversations depuis votre site. Ils apparaîtront dans votre Inbox avec un nom aléatoire jusqu'à ce qu'ils partagent leurs informations. Ensuite, personnalisez Messenger. Adaptez ses couleurs, son lanceur et son message de bienvenue à votre marque. »
Pour le chemin Signed-in users, visitors & leads, continuez à la section Connectez vos données clients ci-dessous pour terminer l'installation.
À partir d'ici, vous pouvez cliquer sur Je le ferai plus tard ou Personnalisez votre Messenger pour passer directement à son style.
Fermez les sessions des users à 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 :
Intercom('shutdown');Astuce : Appelez Intercom('shutdown') dans votre gestionnaire d'événements de déconnexion ou équivalent — où que
votre application termine la session d'un user. Cela efface immédiatement le cookie Intercom pour que le prochain visitor commence une session anonyme et fraîche.
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, il est donc important d'appeler cette méthode à chaque déconnexion.
Connectez vos données clients
Ignorez cette section si vous avez choisi Visitors & leads uniquement — votre installation est déjà terminée une fois que vous l'avez testée ci-dessus. Si vous avez choisi Signed-in users, visitors & leads, continuez ci-dessous pour finir de connecter les attributs de vos users.
Note : Le chemin Signed-in users, visitors & leads nécessite des modifications à la fois dans votre code frontend et backend. Vous aurez besoin d'un accès développeur pour compléter cette section.
Générez un jeton pour chaque client afin d'assurer la sécurité de vos données clients
Sur votre serveur, générez un JSON Web Token (JWT) signé pour chaque user connecté. Par exemple, en Node :
const jwt = require('jsonwebtoken');
const token = jwt.sign(
{ user_id: user.id, email: user.email },
process.env.INTERCOM_SECRET_KEY,
{ algorithm: 'HS256', expiresIn: '1h' },
);
Vous aurez besoin de la clé secrète de votre espace de travail pour cette étape — elle est affichée (masquée) à l'écran. Gardez cette clé sur votre serveur. Ne l'incluez jamais dans le code du navigateur ou de l'application.
Note : Les clés sont spécifiques aux plateformes, et votre espace de travail peut en avoir plusieurs. Vous pouvez créer, faire pivoter ou décoder une clé depuis les paramètres de sécurité de Messenger.
Ajoutez l'extrait mis à jour à votre site web
Ajoutez une ligne à l'extrait que vous avez déjà installé. L'e-mail est extrait du jeton et utilisé pour représenter en toute sécurité l'identité du messenger.
Intercom({
app_id: 'your_app_id',
intercom_user_jwt: token,
});
Cela s'applique partout où vous déployez la modification, donc tout emplacement partageant cette base de code sera également connecté.
Testez votre installation
Cliquez sur Tester l'installation pour confirmer que Messenger fonctionne comme prévu.
💡 Astuce : Besoin d'aide supplémentaire ? Obtenez du support sur notre Forum Communautaire. Trouvez des réponses et obtenez de l'aide auprès du support Intercom et des experts de la communauté.
Articles connexes