How to Capture GCLID in Hidden Form Fields

The GCLID (Google Click ID) appears in your landing page URL when someone clicks your Google Ad. To use it for offline conversion tracking, you need to capture it and store it with the lead record. The most common method: hidden form fields with JavaScript.

The Basic Implementation

Step 1: Add Hidden Form Fields

Add hidden inputs to every form on your website:

<form action="/submit" method="POST">
  <!-- Your visible form fields -->
  <input type="text" name="name" placeholder="Your name" required>
  <input type="email" name="email" placeholder="Your email" required>
  <input type="tel" name="phone" placeholder="Your phone" required>
  
  <!-- Hidden click ID fields -->
  <input type="hidden" name="gclid" id="gclid_field" value="">
  <input type="hidden" name="wbraid" id="wbraid_field" value="">
  <input type="hidden" name="gbraid" id="gbraid_field" value="">
  <input type="hidden" name="fbclid" id="fbclid_field" value="">
  <input type="hidden" name="msclkid" id="msclkid_field" value="">
  <input type="hidden" name="ttclid" id="ttclid_field" value="">
  
  <button type="submit">Submit</button>
</form>

Step 2: JavaScript to Capture and Persist

(function() {
  // Click ID parameters to capture
  var clickIds = ['gclid', 'wbraid', 'gbraid', 'fbclid', 'msclkid', 'ttclid'];
  var params = new URLSearchParams(window.location.search);
  
  clickIds.forEach(function(param) {
    var value = params.get(param);
    
    if (value) {
      // Store in cookie (90 days)
      document.cookie = param + '=' + value + 
        ';max-age=7776000;path=/;SameSite=Lax';
    }
    
    // Read from cookie (for multi-page visits)
    var cookieValue = value || getCookie(param);
    
    if (cookieValue) {
      // Populate all hidden fields with this ID
      var fields = document.querySelectorAll(
        'input[name="' + param + '"]'
      );
      fields.forEach(function(f) { f.value = cookieValue; });
    }
  });
  
  function getCookie(name) {
    var match = document.cookie.match(
      new RegExp('(^|;\\s*)' + name + '=([^;]+)')
    );
    return match ? match[2] : '';
  }
})();

Step 3: Place the Script

Add the JavaScript just before the closing </body> tag, or in your site-wide footer include. It must run after the form HTML is loaded.

How It Works

First Visit (Landing Page)

URL: yoursite.com/landing?gclid=EAIaIQob...
  ↓
JavaScript reads ?gclid= from URL
  ↓
Stores in cookie: gclid=EAIaIQob...; max-age=7776000
  ↓
Populates hidden field: <input name="gclid" value="EAIaIQob...">

Subsequent Pages

URL: yoursite.com/contact (no gclid in URL)
  ↓
JavaScript checks URL → no gclid parameter
  ↓
Reads cookie → gclid=EAIaIQob...
  ↓
Populates hidden field from cookie

Form Submission

User submits form on /contact
  ↓
Form data includes: name, email, phone, gclid=EAIaIQob...
  ↓
Your CRM stores the GCLID with the lead record
  ↓
Later: Upload GCLID + conversion data to Google Ads

Verifying Your Implementation

Method 1: Click ID Tester Tool

Use the Click ID Tester to verify capture in real-time.

Method 2: Manual Test

1. Append a test GCLID to your URL: yoursite.com?gclid=TEST_CLICK_123
2. Open the page
3. Right-click → Inspect → search for TEST_CLICK_123
4. Verify it appears in the hidden input’s value
5. Navigate to another page (e.g., /contact)
6. Verify the cookie preserved the value
7. Submit a test form
8. Check your CRM for the GCLID field

Method 3: Browser Console

// Run in browser console on your page
document.querySelectorAll('input[name="gclid"]')
  .forEach(el => console.log('GCLID:', el.value));

CRM-Specific Considerations

HubSpot

HubSpot has a built-in GCLID field. Use the onFormReady callback:

hbspt.forms.create({
  onFormReady: function($form) {
    var gclid = getCookie('gclid');
    if (gclid) {
      $form.find('input[name="google_ad_click_id"]').val(gclid);
    }
  }
});

Salesforce Web-to-Lead

Add a hidden field mapped to a custom Salesforce field:

<input type="hidden" name="00Nxxxxxxxx" id="gclid_field" value="">

WordPress (Gravity Forms, WPForms)

Most WordPress form plugins support hidden fields. Configure them to use the gclid URL parameter as the default value.

Best Practices

1. Capture ALL click IDs — GCLID, WBRAID, GBRAID, FBCLID, MSCLKID, TTCLID
2. Use cookies for persistence — 90-day cookie matches GCLID validity
3. Set SameSite=Lax — Required for modern browsers
4. Place on every form — Contact, quote request, booking, newsletter
5. Test monthly — Browser updates can break cookie behavior
6. Use the Click ID Tester — Click ID Tester tool for verification