Comment ajouter un bouton WhatsApp avec suivi GCLID à votre site Web

Ce guide vous aidera à ajouter un bouton à votre site web pour ouvrir une discussion WhatsApp. Si un paramètre gclid est présent dans l'URL (provenant de Google Ads), il sera inclus dans le texte du message, ce qui est utile pour suivre les prospects des campagnes publicitaires.

‍

‍Ce que fait cette intégration

• Affiche un bouton « Écrire à WhatsApp » sur votre page Web.
  
  
• Lit le paramètre gclid à partir de l'URL (si présent).
  
  
• Génère un lien WhatsApp incluant la valeur gclid dans le texte du message.
  
  
• Met à jour le href du bouton de manière dynamique.
  
  

Étape 1 : ajouter le bouton HTML

Placez le code HTML suivant à l'endroit où vous souhaitez que le bouton WhatsApp apparaisse :

‍

 "wa-link" href= "#" target= "_blank"  class = "btn btn-success" >Écrire sur WhatsApp

‍

Ce bouton sera ultérieurement mis à jour via JavaScript.

‍

Étape 2 : ajouter le code JavaScript

Avant la clôture</body> tag, insérez le script suivant :

‍

function  scriptToInclude(id, phone) {     // 1. Read URL parameters 
    const params = new URLSearchParams(window.location.search);     const gclid = params.get('gclid'); 
    // 2. Generate WhatsApp link 
    const waBase = 'https://wa.me/' + phone;     const text = 'Google Ads (gclid) ';     const waLink = gclid ? `${waBase}?text=${encodeURIComponent(text + gclid)}` : waBase; 
    // 3. Update the button href 
    const linkEl = document.getElementById(id);     if (linkEl) {  linkEl.href = waLink;  }  } 
  // Call the function with your parameters 
 scriptToInclude('wa-link', '123456789');  

‍

Remplacez 123456789 par votre propre numéro WhatsApp au format international sans « + » ni espaces .

‍

Utilisation de la fonction Générateur de script

Si vous insérez des boutons de manière dynamique ou avez besoin de flexibilité sur plusieurs pages, vous pouvez utiliser cette fonction de modèle :

‍

fonction  generateWhatsAppHrefUpdateScript ( id, téléphone ) {   return  ` (function() {  const params = new URLSearchParams(window.location.search);  const gclid = params.get('gclid');  const waBase = 'https://wa.me/' + '${phone}';  const text = 'Google Ads (gclid) ';  const waLink = gclid ? waBase + '?text=' + encodeURIComponent(text + gclid) : waBase;  const linkEl = document.getElementById('${id}');  if (linkEl) linkEl.href = waLink;  })(); ` ; }

‍

Exemple d'utilisation :

‍

document .write(generateWhatsAppHrefUpdateScript( 'wa-link' , '7910000000' ));

‍

Résumé

Cette méthode vous permet de suivre les prospects Google Ads en transmettant la valeur gclid au message WhatsApp. Vous pouvez utiliser cette configuration sur tout site permettant l'insertion de JavaScript personnalisé.