1. All Collections >
  2. Canaux >
  3. Widget de chat du site web >
  4. Installer le widget de chat du site Web sur WordPress

Installer le widget de chat du site Web sur WordPress

Avatar
JQ Lee
3 min de lecture

L'ajout d'un widget de chat Web à votre site Web WordPress est un processus simple et rapide. Il ne nécessite aucune compétence en codage ni connaissance technique.

Préparation de l'installation

Pour installer un widget de chat Web sur WordPress, vous aurez besoin des éléments suivants :

  • Accédez au tableau de bord WordPress de votre site.

  • Un extrait de code pour votre widget de chat Web.

Si tu n’as pas encore d'extrait de code, tu le généreras lors de la création d'un Widget de Chat Website ou en utilisant le Plugin de Chat Facebook pour Facebook Messenger.

Si vous avez déjà les canaux connectés sur la plateforme respond.io et que vous devez récupérer l'extrait de code généré, suivez les instructions ici.

Pour une installation réussie, assurez-vous que le domaine de votre site Web est renseigné. Il y a deux façons de procéder.

Accédez à respond.io Paramètres > sélectionnez Canaux > sélectionnez le canal de discussion de votre site Web > cliquez sur configurer > ajoutez un domaine de site Web. 

Accédez aux paramètres de respond.io > sélectionnez Widgets de croissance > cliquez sur le widget que vous souhaitez ajouter à votre site Web > dans le bouton Général , ajoutez le domaine de votre site Web au champ Domaines de sites Web .

Installation sur WordPress

Étape 1 : Connectez-vous à WordPress

Accédez au tableau de bord d’administration WordPress de votre site Web et connectez-vous.

Étape 2 : Accédez à la page des plugins

Dans le panneau de navigation de gauche, cliquez sur Plugins. Sur la page des plugins, appuyez sur le bouton bleu Ajouter un nouveau en haut de la page.

Étape 3 : Ajouter un nouveau plugin

À l'aide de la barre de recherche, recherchez le plugin WPCode . Vous verrez de nombreuses options sur la page de résultats de recherche que vous pouvez utiliser, mais nous utiliserons le plugin "Insérer un en-tête et des pieds de page" de WPCode pour ce tutoriel. Appuyez sur le bouton Installer maintenant et assurez-vous d'activer le plugin pour l'utiliser.

Étape 4 : Ouvrir la console des en-têtes et des pieds de page

Dans le menu de navigation de gauche, cliquez sur Extraits de code et sélectionnez En-tête & Pied de page dans le sous-menu.

Étape 5 : Ajouter le script de chat en direct

Copiez votre script de plugin depuis respond.io et collez-le dans la section Script dans le pied de page de la page de la console En-tête et pied de page.

Une fois le script collé, cliquez sur le bouton bleu "Enregistrer" en bas de la page.

Fait!

Ouvrez le site Web et consultez le plugin de chat. Vous le trouverez dans le coin inférieur droit. Désormais, les visiteurs de votre site Web peuvent discuter sans effort avec vous. Si vous avez utilisé les extraits de code générés à partir de la plateforme respond.io, vous pourrez gérer les conversations et mettre à jour l'apparence du widget à partir de la plateforme.

Le widget de chat est désormais actif sur votre site Web !

Identifier les utilisateurs connectés

Cette section n'est applicable que si votre site Web dispose d'une fonction de connexion utilisateur.

Étape 1 : Connectez-vous à votre compte WordPress

Accédez au tableau de bord d’administration WordPress de votre site Web et connectez-vous.

Étape 2 : Ouvrir les fichiers d’en-tête du thème

Dans le menu de navigation de gauche, cliquez sur Apparence et sélectionnez Éditeur de fichiers de thème. Procédez à la sélection du fichier Theme Header .

Étape 3 : ajoutez l’ID utilisateur et le code de nom récupérés

Copiez l’exemple de code ci-dessous et collez-le dans le fichier d’en-tête du thème. Une fois que tu as collé le code, clique sur le bouton Mettre à jour le fichier en bas de la page.

L'exemple de code ci-dessous permet d'obtenir l'ID utilisateur, le prénom et le nom de famille de WordPress. N'hésitez pas à modifier si vous souhaitez obtenir d'autres champs de contact.

`

Étape 4 : Ouvrir la console des en-têtes et des pieds de page

Dans le menu de navigation de gauche, cliquez sur Paramètres et sélectionnez le plugin En-tête & Pied de page dans le sous-menu des paramètres.

Étape 5 : Ajouter le script d'identification de l'utilisateur connecté

Copiez l'exemple de code ci-dessous et collez-le dans la section Script dans le pied de page de la page de la console En-tête et pied de page. Notez que le script d'identification de l'utilisateur connecté doit être placé au-dessus du script de chat en direct ..

L'exemple de code ci-dessous utilise l'ID utilisateur comme identifiant et le transmet avec le prénom et le nom. N'hésitez pas à modifier si vous souhaitez obtenir d'autres champs de contact.

<script>  
      window.\_\_respond\_settings = {  
    	identifier: $wp\_ID,  
        firstName: $wp\_firstname,  
        lastName: $wp\_lastname,    
      };  
</script>

Une fois le script collé, cliquez sur le bouton bleu "Enregistrer" en bas de la page.

Fait!

Ouvrez le site Web et consultez le plugin de chat. Les utilisateurs connectés à votre WordPress peuvent être identifiés. Une fois que l'identifiant transmis correspond à un contact existant, la conversation en cours reprendra.

FAQ et dépannage

WPCode

Si vous utilisez un plugin de cache WordPress tel que WPCode, suivez ces étapes pour que le widget apparaisse correctement.

Désactiver la fonctionnalité de minification des données pour JavaScript

Accédez à Paramètres WordPress > Sélectionnez WPCode > Sur la page WPCode, sélectionnez Optimisation des fichiers onglet > décochez Minifier les fichiers JavaScript

Ajoutez notre domaine de widget aux fichiers Javascript exclus

https://cdn.respond.io/webchat/widget/(.*).js

Une fois enregistré, il est recommandé de vider le cache dans WordPress.

Partager cet article
Telegram
Facebook
Linkedin
Twitter

Vous ne trouvez pas ce que vous recherchez? 🔎