Home » WordPress » Comment ajouter le chat Facebook Messenger à un site WordPress

Comment ajouter le chat Facebook Messenger à un site WordPress

Si vous cherchiez des moyens d’intégrer une application de chat en direct à votre site Web il y a quelques années, vous deviez probablement installer un plugin volumineux et compliqué ou même une application dédiée qui serait un casse-tête à utiliser.

Il existe désormais une alternative intelligente aux applications de chat en direct – vous pouvez intégrer Facebook Messenger à votre site WordPress. Et vous pouvez le faire vous-même en moins de 5 minutes !

Il y a cependant une exigence. Afin d’avoir un chat Facebook Messenger sur votre site web, vous devez avoir une sorte de page Facebook. Pourquoi ? Parce que l’utilisation la plus courante d’un chat sur un site web est de permettre aux clients de communiquer plus facilement avec votre entreprise. Vous avez donc probablement déjà une page Facebook pour votre entreprise de toute façon.

Comment intégrer le chat Messenger à un site WordPress

Première étape – préparer votre site WordPress

Best WordPress hosting 2024

La première chose dont vous avez besoin si vous voulez ajouter le chat Messenger à votre site, est d’aller dans Apparence >> Éditeur de thème, et d’ouvrir le fichier de fonctions du thème – functions.php. Voici l’exemple de ce que vous verrez (cela peut varier en fonction du thème WordPress que vous utilisez) :

How to add Facebook Messenger chat to WordPress website

Faites défiler jusqu’au bas du fichier, et ajoutez ce code à la fin du fichier :

function fb_chat_code() {

}
add_action('wp_body_open', 'fb_chat_code');

Cliquez ensuite sur Mettre à jour le fichier pour qu’il ressemble à ceci :

how to add facebook chat to wordpress website

Deuxième étape – générer le code de chat Messenger dans Facebook

Allez sur le site Web de Facebook, et ouvrez votre page Facebook – celle à laquelle vous voulez associer votre site Web. Si vous êtes défini comme administrateur de la page, vous verrez un menu d’administration sur la gauche. Cliquez sur Paramètres.

how to integrate facebook messenger to wordpress website

Étape suivante – sélectionnez Messagerie sur la gauche, et faites défiler jusqu’à la section Ajouter Messenger à votre site web. Cliquez sur Get Started.

add messenger in wordpress

Maintenant vous verrez un assistant qui vous guidera à travers les paramètres du chat Messenger. Vous pouvez choisir la langue de la messagerie, modifier le message d’accueil, autoriser ou non la discussion avec les invités. Lorsque vous avez terminé, cliquez sur Suivant.

messenger live chat in wordpress

Étape suivante – vous pouvez modifier la couleur par défaut de la fenêtre Messenger pour l’adapter à la palette de couleurs de votre site Web. Si vous en avez besoin, faites le changement, et cliquez sur Next.

wordpress facebook messenger

Après avoir fait cela, entrez l’adresse URL de votre site web (y compris http… ) dans le coin supérieur gauche de la fenêtre. Cela permettra d’utiliser Messenger uniquement sur votre site web spécifié, de sorte que personne ne puisse copier et utiliser le même code sur d’autres sites. Cliquez sur Enregistrer.

facebook messenger code for wordpress

L’étape finale – cliquez sur la fenêtre des extraits de code à droite, et copiez le code Messenger. Vous devrez l’ajouter à votre site web WordPress. Puis cliquez sur Terminer.

integrate facebook messenger to wordpress

Troisième et dernière étape – ajouter le code du chat Messenger à WordPress

Maintenant, vous devez retourner sur votre site web WordPress. Cliquez sur Apparence >> Éditeur de thème, et ouvrez à nouveau le fichier functions.php. Faites défiler jusqu’au bas du fichier où vous avez précédemment ajouté une fonction, et faites ce changement :

function fb_chat_code() {
    echo " PUT MESSENGER CODE BETWEEN THESE DOUBLEQUOTES ";
}
add_action('wp_body_open', 'fb_chat_code');

Puisque nous utilisons des guillemets dans notre fonction (« ), et que le code de Messenger utilise également des guillemets, nous devons ajouter des antislashs ( ) entre chaque guillemet dans le code de Messenger (6 endroits).

Voici à quoi devrait ressembler le code final (les 6 barres obliques inverses sont marquées en vert dans l’exemple) :

add facebook messenger live chat to wordpress website

Après avoir collé le code Messenger et ajouté les barres obliques inversées, cliquez sur le bouton Update File. Si tout va bien, vous verrez un message de réussite :

wordpress messenger chat

Résultat final

Si toutes les étapes ont été complétées avec succès, le chat Messenger apparaîtra sur chaque page de votre site WordPress. Voici un exemple de ce à quoi cela ressemblerait sur ce site web :

messenger chat in wordpress website
Fathom analytics - privacy focused cookie-free website analytics

Most popular tutorials


Get our latest WordPress news and special offers from RockSolidWP!

Only useful WordPress and WooCommerce tips and tricks and exclusive offers for our readers once a month. No marketing nonsense.

Looking for reliable yet affordable WordPress hosting?
Hostinger is the way to go!

Get 10% OFF by using code IMAKEITWORK