So fügen Sie Ihrer Website einen WhatsApp-Button mit GCLID-Tracking hinzu

Diese Anleitung hilft Ihnen, Ihrer Website einen Button hinzuzufügen, der einen WhatsApp-Chat öffnet. Wenn in der URL ein gclid-Parameter (aus Google Ads) vorhanden ist, wird dieser in den Nachrichtentext eingefügt – nützlich für die Verfolgung von Leads aus Werbekampagnen.

‍

‍Was diese Integration bewirkt

• Zeigt auf Ihrer Webseite eine Schaltfläche „An WhatsApp schreiben“ an.
  
  
• Liest den gclid-Parameter aus der URL (falls vorhanden).
  
  
• Erzeugt einen WhatsApp-Link, der den gclid-Wert im Nachrichtentext enthält.
  
  
• Aktualisiert dynamisch den href-Wert der Schaltfläche.
  
  

Schritt 1: HTML-Schaltfläche hinzufügen

Fügen Sie den folgenden HTML-Code an der Stelle ein, an der der WhatsApp-Button erscheinen soll:

‍

 "wa-link" href= "#" target= "_blank"  class = "btn btn-success" >An WhatsApp schreiben

‍

Dieser Button wird später per JavaScript aktualisiert.

‍

Schritt 2: JavaScript-Code hinzufügen

Vor dem Abschluss</body> Fügen Sie im Tag das folgende Skript ein:

‍

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');  

‍

Ersetzen Sie 123456789 durch Ihre eigene WhatsApp-Nummer im internationalen Format ohne "+" oder Leerzeichen .

‍

Verwendung der Skriptgeneratorfunktion

Wenn Sie Schaltflächen dynamisch einfügen oder Flexibilität über mehrere Seiten hinweg benötigen, können Sie diese Vorlagenfunktion verwenden:

‍

function  generateWhatsAppHrefUpdateScript ( id, 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;  })(); ` ; }

‍

Anwendungsbeispiel:

‍

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

‍

Zusammenfassung

Diese Methode hilft Ihnen, Leads aus Google Ads zu erfassen, indem der gclid-Wert in die WhatsApp-Nachricht eingefügt wird. Sie können diese Konfiguration auf jeder Website verwenden, die das Einfügen von benutzerdefiniertem JavaScript zulässt.