Ouvrir le widget de chat depuis votre propre bouton

Mis à jour le 4 nov. 20263 min de lecture
Français
Sur cette page

Vous pouvez masquer le bouton rond de votre chat en direct et ouvrir le chat depuis votre propre bouton ou lien. Activez Masquer le bouton du chat dans les paramètres de votre boîte de réception de chat en direct, puis appelez window.deskwootWidget.open() depuis votre bouton. Le code du widget reste sur votre page ; seul le bouton du chat est masqué. Les visiteurs ne peuvent alors ouvrir le chat qu'avec votre bouton, votre page doit donc avoir ce bouton. Si vous avez configuré un déclencheur de chat, il ouvre toujours le chat tout seul sur ordinateur.

Mise en place

  1. Allez dans Paramètres > Boîtes de réception et cliquez sur Configurer pour votre boîte de réception de chat en direct.
  2. Dans l'onglet Widget, trouvez Bouton du chat et activez Masquer le bouton du chat. L'interrupteur enregistre le changement tout de suite.
  3. Laissez le code du widget sur votre site. Vous le trouvez dans le même onglet, sous Installation du widget. S'il n'est pas encore installé, consultez Intégrer le widget.
  4. Ajoutez un bouton ou un lien qui ouvre le chat :
<button onclick="window.deskwootWidget.open()">Contact support</button>

Un lien fonctionne de la même façon :

<a href="#" onclick="window.deskwootWidget.open(); return false;">Contact support</a>

Ce que vous pouvez faire d'autre

  • window.deskwootWidget.close() ferme le chat et window.deskwootWidget.toggle() l'ouvre ou le ferme : un seul bouton peut donc faire les deux.
  • window.deskwootWidget.open({ anchor: this }) fait sortir le chat de votre bouton plutôt que du coin de la page. Un sélecteur CSS comme "#support-button" fonctionne aussi comme ancre.
  • window.__deskwootUnread contient le nombre de nouvelles réponses de votre équipe ou de votre bot IA arrivées pendant que le chat était fermé, pour afficher une pastille sur votre bouton. Ouvrir le chat le remet à 0. Chaque changement déclenche aussi un événement deskwoot:unread sur window.
  • window.deskwoot est le même objet que window.deskwootWidget.

La référence complète se trouve dans la documentation du widget. Les couleurs et les textes du chat lui-même sont expliqués dans Personnaliser votre widget de chat.

Questions fréquentes

Masquer le bouton du chat retire-t-il le chat de mon site ?

Non. Seul le bouton du chat est masqué. Le chat se charge toujours et s'ouvre quand votre code appelle open().

Et si un visiteur clique avant que le widget soit chargé ?

Les appels faits pendant le démarrage du widget sont mis en attente et s'exécutent dès qu'il est prêt. Seul le code qui s'exécute avant le code du widget lui-même a besoin d'une vérification comme if (window.deskwootWidget).

Quelles boîtes de réception ont ce réglage ?

Les boîtes de réception de chat en direct (site web). Les autres canaux n'ont pas de widget : la section Bouton du chat n'apparaît donc que pour le chat en direct.

Puis-je afficher le bouton du chat sur certaines pages et mon bouton sur d'autres ?

Masquer le bouton du chat s'applique à toutes les pages qui utilisent le widget de cette boîte de réception. Si vous voulez le bouton du chat sur certaines pages, laissez Masquer le bouton du chat désactivé et ajoutez votre propre bouton là où vous le voulez. Le bouton du chat et votre bouton ouvrent le même chat.

Rien ne se passe quand je clique sur mon bouton. Que dois-je vérifier ?

Vérifiez que le code du widget se trouve sur cette même page et que le bouton appelle window.deskwootWidget.open() exactement comme écrit, avec les parenthèses.

Puis-je afficher le nombre de réponses en attente ?

Oui. Lisez window.__deskwootUnread, ou écoutez l'événement deskwoot:unread sur window, et affichez le nombre sur votre bouton.

Ce guide vous a-t-il aidé ?

Continuer la lecture

Demander à Fynn à propos de ce guide

Obtenez une réponse courte tirée de ce guide et du reste du centre d'aide.

Besoin d'aide supplémentaire ?

Fynn répond dans le chat à partir de ces guides, et vous pouvez aussi y joindre l'équipe.

Écrivez-nous par e-mail