Passer au contenu principal

Créer un lanceur personnalisé

Apprenez à créer un lanceur personnalisé sur votre site ou application mobile.

Écrit par Beth-Ann Sher

Si vous souhaitez que le Messenger se lance depuis un bouton, un lien ou un élément spécifique de votre application, site ou application mobile, vous pouvez créer un lanceur personnalisé. Par exemple, vous pouvez déclencher l'ouverture du Messenger lorsqu'un utilisateur clique sur votre bouton « Parlez-nous » ou sur l'icône de chat.

Cet article vous guidera dans le processus de création d'un lanceur personnalisé afin qu'il s'intègre parfaitement à votre produit, site ou application mobile.

Vous pouvez ajouter autant de lanceurs personnalisés que vous le souhaitez à votre produit, site web ou application mobile.

Ce n'est pas ce que vous cherchez ?

Si ce n'est pas déjà fait, nous vous recommandons de suivre ces étapes essentielles pour personnaliser le Messenger standard dans vos paramètres. Et voici comment afficher le lanceur Messenger standard sur votre application iOS ou Android.


 

Créer un lanceur personnalisé sur votre application web ou site

1. Passez l'ID de l'élément que vous utilisez comme lanceur personnalisé pour ouvrir le Messenger (par exemple, "#my_custom_link"). Ou vous pouvez spécifier plusieurs liens en passant une classe à la place (par exemple, ".my_custom_class_name")

2. Ajoutez l'ID ou la classe à l'élément HTML sur lequel vous souhaitez que le Messenger s'ouvre lorsqu'on clique dessus. Par exemple, si vous voulez que le Messenger s'ouvre lorsqu'une personne clique sur un lien vers votre adresse email de support :

<a id="my_custom_link" href="mailto:HELP@YOUR-APP.COM">Support</a>


Note : Inclure votre adresse de support comme destination du lien fonctionne bien comme solution de secours, ainsi si un visiteur n'a pas JavaScript activé dans son navigateur, il peut envoyer un email à votre équipe.

3. Ajoutez cette ligne à votre extrait IntercomSettings :

custom_launcher_selector:'#my_custom_link'

Comme ceci :

window.intercomSettings = {
  app_id: "YOUR_APP_ID",
  custom_launcher_selector:'#my_custom_link'
};

Important : Vous pouvez choisir de désactiver le lanceur standard afin que seul votre lanceur personnalisé apparaisse.


Configurer un lanceur personnalisé avec Google Tag Manager (GTM)

Vous pouvez également spécifier un lanceur personnalisé en utilisant GTM en définissant la valeur custom_launcher_selector dans les « Attributs de données personnalisés » de votre balise d'installation GTM.


Créer un lanceur personnalisé sur votre application mobile

Voici comment créer un lanceur personnalisé sur votre application iOS ou Android et comment afficher le nombre de conversations non lues de vos users.


Et ensuite ?

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