Un bouton flottant « Discuter sur WhatsApp » transforme les visiteurs de votre site en conversations. La bonne nouvelle : vous pouvez en ajouter un à presque n'importe quel site sans écrire de vrai code. Voici trois approches, de la plus simple qui soit à un extrait léger à copier-coller.
D'abord : préparez votre lien WhatsApp
Chaque méthode ci-dessous a besoin d'un lien wa.me. Si vous n'en avez pas encore, créez votre lien WhatsApp gratuit — saisissez votre pays, votre numéro et un message pré-rempli comme « Bonjour ! Je suis sur votre site et j'ai une question. » Copiez l'URL finalisée ; vous la collerez dans la méthode que vous choisissez.
Méthode 1 : un simple bouton-lien (le vrai no-code)
Si votre constructeur de site vous laisse ajouter un bouton ou un lien (ils le font tous), vous n'avez même pas besoin de widget :
- Ajoutez un élément bouton n'importe où — en-tête, pied de page, ou barre fixe.
- Réglez son lien / URL sur votre lien
wa.me. - Réglez-le pour qu'il s'ouvre dans un nouvel onglet.
- Nommez-le « Discuter sur WhatsApp » et, si vous le pouvez, ajoutez l'icône verte de WhatsApp.
Ça marche sur Wix, Squarespace, Webflow, WordPress, Shopify, Carrd — tout. Ce n'est pas une bulle flottante, mais c'est sans risque et ça prend 60 secondes.
Méthode 2 : un service de widget no-code
Des services comme WATI, Chaty, Chaport ou Tidio vous fournissent une bulle flottante hébergée que vous activez depuis un tableau de bord :
- Inscrivez-vous et saisissez votre numéro WhatsApp et votre message pré-rempli.
- Personnalisez la couleur, la position et le message d'accueil de la bulle.
- Copiez le
<script>d'une ligne qu'ils vous donnent. - Collez-le dans la zone « code personnalisé / pied de page » de votre site (chaque constructeur en a une).
Avantages : une bulle soignée et animée avec un texte d'accueil et des horaires. Inconvénients : c'est une dépendance externe, ça peut charger du JavaScript supplémentaire, et certains paliers sont payants. Pour la plupart des petits sites, l'offre gratuite suffit largement.
Méthode 3 : un bouton flottant à copier-coller (sans service, sans extension)
Vous voulez un bouton flottant sans vous inscrire nulle part ? Collez ceci dans la zone HTML personnalisé / pied de page de votre site et changez le numéro :
<a href="https://wa.me/15551234567?text=Bonjour%20!%20J'ai%20une%20question."
target="_blank" rel="noopener"
style="position:fixed;bottom:20px;right:20px;z-index:9999;
background:#25D366;color:#fff;padding:14px 18px;border-radius:50px;
font-family:sans-serif;text-decoration:none;
box-shadow:0 4px 12px rgba(0,0,0,.15);">
💬 Discuter sur WhatsApp
</a>
C'est un simple lien stylé pour flotter dans le coin inférieur droit. Pas de JavaScript, rien à casser, aucun frais mensuel. Remplacez 15551234567 par votre numéro et ajustez le message.
Où placer le bouton
- Le coin inférieur droit est la convention universelle — les utilisateurs s'attendent à y trouver la discussion.
- Une barre de pied de page fixe sur mobile fonctionne bien pour les boutiques.
- À l'intérieur de la section contact sous forme de gros bouton principal.
Évitez de recouvrir du contenu important ou de l'empiler par-dessus une bannière de cookies.
Astuces de design qui augmentent les clics
- Utilisez le vert officiel (
#25D366) et l'icône WhatsApp pour qu'il soit instantanément reconnaissable. - Gardez un libellé orienté action : « Discutez avec nous » ou « Discuter sur WhatsApp » l'emporte sur « Contact ».
- Ajoutez une discrète bulle d'accueil (« Des questions ? Écrivez-nous ! ») qui apparaît après quelques secondes — la plupart des services de widget le font automatiquement.
- Affichez vos horaires d'ouverture si vous ne pouvez pas répondre instantanément, afin de poser les attentes.
Pré-remplissez toujours un message
Quelle que soit la méthode choisie, incluez un message pré-rempli ?text=. Une discussion vide fait hésiter les visiteurs ; une première ligne prête (« Bonjour ! Je suis sur votre site… ») les fait parler. Apprenez-en plus dans comment ajouter un message pré-rempli.
Testez sur de vrais appareils
Avant de considérer que c'est terminé :
- Sur un téléphone : touchez le bouton — l'application WhatsApp doit s'ouvrir avec votre message prêt.
- Sur ordinateur : il doit ouvrir WhatsApp Web (les utilisateurs doivent être connectés).
- Vérifiez le placement sur mobile et sur ordinateur ; un bouton parfait sur ordinateur peut recouvrir votre menu sur mobile.
Numéro professionnel ou personnel
Faites pointer le bouton vers un numéro WhatsApp Business, pas votre numéro personnel. Business vous offre un profil professionnel, un message d'accueil et des réponses rapides — tous précieux dès que les discussions depuis le site commencent à affluer. Consultez WhatsApp Business ou personnel.
Récapitulatif
Le chemin le plus rapide : créez votre lien WhatsApp gratuit, puis ajoutez-le soit comme un bouton normal (Méthode 1), soit en collant l'extrait du bouton flottant (Méthode 3). Aucune extension, aucun code au-delà du copier-coller, et aucun frais mensuel.