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

Diese Anleitung hilft Ihnen, einen Button auf Ihrer Website einzubinden, der einen WhatsApp-Chat öffnet. Falls die URL einen gclid-Parameter (von Google Ads) enthält, wird dieser in den Nachrichtentext eingefügt – nützlich für die Lead-Verfolgung Ihrer Werbekampagne

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:

<a id="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:

<script>
  function scriptToInclude(id, phone) {
    // 1. URL-Parameter lesen
    const params = new URLSearchParams(window.location.search);
    const gclid = params.get('gclid');

    // 2. WhatsApp-Link generieren
    const waBase = 'https://wa.me/' + phone;
    const text = 'Google Ads (gclid) ';
    const waLink = gclid ? `${waBase}?text=${encodeURIComponent(text + gclid)}` : waBase;

    // 3. Button-href aktualisieren
    const linkEl = document.getElementById(id);
    if (linkEl) {
      linkEl.href = waLink;
    }
  }

  // Funktion mit Parametern aufrufen
  scriptToInclude('wa-link', '123456789');
</script>

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 `
<script>
  (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;
  })();
</script>
  `;
}

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.

Verwandte Artikel/Neuigkeiten

WhatsApp Business API kostenlos testen

Ihre persönliche WhatsApp-Nummer* ?
Nummer für die WhatsApp Business API* ?
Ihre Firmenwebsite-URL
Welche App möchten Sie mit WhatsApp verbinden?
Vielen Dank! Ihre Einsendung ist eingegangen!
Hoppla! Beim Absenden des Formulars ist ein Fehler aufgetreten.