Use GTM To Capture And Send, Google Ads Click ID (gclid) with Form Submissions in Hidden Field
Most businesses rely on a form submission for initial contact of a lead into the sales team but this rarely happens from a user landing on the “contact us” page, filling in the form and leaving.
When a user clicks through from Paid Search on Google, to preserve the original click (gclid) tracking across pages, we use the Conversion Linker Tag in GTM. As this is a 1st Party cookie we can store and send this data as needed (after the user provides marketing consent).
The Conversion Linker Tag can also be part of a robust solution to send the gclid value not just to Google Ads but to any analytics platform, CRM or spreadsheet. Google’s OCI (Offline Conversion Import) process requires the gclid to be passed back into Google Ads with its business value i.e. final sales revenue (or an earlier stage in the lifecycle process) for tROAS bidding allowing B2B customers to bid for prospects not on the fact someone filled in a form but on the potential business value that submission may yield.
Steps to Send Additional Information in Hidden Form Fields using GTM
Use the Conversion Linker Tag in GTM to access the gclid
As this is provided by Google we can assume it is robust and very reliable!
Store the gclid value in a new First Party Cookie Variable from within GTM and re-format with a custom JavaScript variable
Create a hidden form field to write the value of the gclid into (used for this specific purpose)
Create a GTM tag to populate the value of the hidden form field with that of the JavaScript variable on page load
When the User submits the form, the gclid value will be sent along with all the other details to the target destinations e.g a CRM or spreadsheet
Capture and send any ad click ID using the same principles
The same process can be applied to any ad platform including Meta, LinkedIn and Microsoft Ads by creating a 1st Party Cookie Variable in GTM, a corresponding hidden form field for each and a querySelector Tag.
1. Make gclid Available in GTM From Conversion Linker Tag
The Conversion Linker Tag sets the value and handles the storage of the gclid through a 1st Party Cookie that we will also make use of.
The Conversion Linker Tag passes the gclid across all pages and sends the conversion data to google. It does this by storing the value in a cookie called “_gcl_aw” for Google Ads or “_gcl_dc” for Campaign Manager (floodlight).
Create a First-Party Cookie variable in GTM and get it to store its value.
As a demonstration, if I generate a fake gclid value of e.g. test4, preview GTM, then open dev console and look at the list of cookies, I can see the _gcl_aw has a value of GCL.17099etc.test4
2. Store the gclid value in a new variable
Next we need to parse the value of this variable so we are left with the part we need. We only want to keep and store the last bit after the last full stop. So we need another GTM variable to grab that. Copy/Paste the code below. It separates out the value above by delimiting (like in excel) on a dot and then “pop” returns the last value i.e. “test4”.
function () {
return {{gclid - Store from Conversion Linker Cookie}}.split(".").pop();
}
3. Create a hidden field on the form to store the gclid value
How and where you do this is CMS dependent and also which app for Forms your company uses and if the paid or free version is used. This website uses Squarespace which has its own form widget, WordPress CMS and there are a lot of form plugins for this e.g. Gravity Forms, Contact Form 7, WPForms, Ninja Forms (all of which I have experience with). Other website builders include Wix, Webflow and Hubspot (which is also a CRM).
Squarespace Hidden Form Field
Adding a hidden field to a form in Squarespace and all other Form Widgets is straightforward. The screenshot below shows what this would like for the field that I labelled “gclid”. Squarespace taxonomy auto-populates the name of this variable and prefixes “SQF_” to it. It also sets the name to be in ALL CAPS.
View the Form in the Console and write a CSS Selector that uniquely identifies the hidden form field by its name “SQF_GCLID”.
When I right-click on the Message (required) field of the Form on my contact-us page and select “Inspect” option, the Elements tab shows the image below.
Within the class “field-list” and highlighted in green is the section that describes the attributes that we are interested in: name, type, value
<input id="hidden-1f0e2035-b70a-4786-99fe-80df426fa023-field" name="SQF_GCLID" type="hidden" value="">
Test & confirm the CSS and JavaScript in the Console that will eventually be used by a Tag in GTM. The general steps are shown below:
Create a test variable for the gclid value
Write a querySelectorAll that only returns one result i.e. the NodeList length is 1
Print this again using querySelector (to be used in the GTM Tag)
Assign the value of the hidden form field selected to that of the gclid variable
Print it out again to confirm it worked
The querySelector I wrote “document.querySelector("input[name$='GCLID']")” would be interpreted as “find the first “input” that has an [attribute] name that ends ($) in GCLID”
4. Replicate in GTM with A Custom HTML Tag
Go to Google Tag Manager and set up a new Custom HTML Tag that reflects the steps above but with some changes to make it compatible with GTM and the GTM gclid variable we defined earlier. Set the Tag to fire later than usual so that the form will have had time to load e.g. on DOM Ready or Window Loaded
<script>
(function(){
document.querySelector("input[name$='GCLID']").value = {{gclid - Get Value}};
})();
</script>
Preview and Test this in GTM before publishing
To test that the conversion linker and _gcl_aw cookie is a robust method I Preview GTM on non-form page that has a “fake” gclid value in the URL and then navigate to the form page before checking that the form field is populated as desired. This is shown in the screenshot in Step 1 above.
Cookie Names of Other Ad Platform Click IDs (and GA4 Client ID)
| Platform | Cookie Name | Purpose | Example Cookie Value | Query Parameter |
|---|---|---|---|---|
| Google Ads | _gcl_aw | Stores the Google Ads Click ID (GCLID) for tracking conversions tied to the specific ad | GCL.123.Cj0KCQiAn4SeBhCwARIsANeF9DGye | ?gclid=Cj0Ketc |
| Google Ads | _gcl_au | A broader Google Ads cookie used for attribution beyond specific Ad clicks | 1.1.123.Cj0KCQiAn4SeBhCwARIsANeF9DGye | n/a |
| Google Ads (Floodlight) | _gcl_dc | Stores the GCLID for Google Campaign Manager (Floodlight) | Cj0KCQiAn4SeBhCwARIsANeF9DGye | ?gclid= |
| Google Analytics | _ga | Stores the Google Analytics Client ID | GA1.1.123456789.987654321 | n/a |
| Meta (Facebook) | _fbc | Stores the Facebook Click ID (FBCLID) | fb.1.1699999999.ABCDEF123456 | ?fbclid=ABCDetc |
| Meta (Facebook) | _fbp | Stores a first-party cookie for Meta pixel tracking | fb.1.1699999999.ABCDEF123456 | n/a |
| Microsoft Ads (Bing) | _uetmsclkid | Stores the Microsoft Ads Click ID (MSCLKID) for attribution | _uetabcdef1234567890abcdef1234567890 | ?msclkid=abcetc |
| Microsoft Ads (Bing) | _uetsid | Stores the Bing Ads Click ID (MSCLKID) for sessions | abcdef1234567890abcdef1234567890 | n/a |
| Microsoft Ads (Bing) | _uetvid | Stores the Bing Ads Click ID (MSCLKID) for visitors | abcdef1234567890abcdef1234567890 | n/a |
| _li_ms | Stores LinkedIn click tracking data | C1234ABCD1234 | ?li_fat_id= | |
| Twitter Ads | _twq_click_id | Stores the Twitter Click ID for campaign attribution | 123456abcdef | ?twclid= |
| Pinterest Ads | _pin_unauth | Stores Pinterest click tracking data for unauthenticated users | C1234ABC | ?pinclid= |
Use an appropriate custom JavaScript method, depending on the location of the clickID within the cookie.
For clarity, it is the ad platform that appends its own clickID query parameter to the landing Page URL within the Ad Account. This its own unique “key” to monitor and measure performance on and off the platform and connect the data together such as impressions, cost to conversions, revenue, etc. In order to make this useful to your business and the whole reason for passing this data is up to what you want to do with it and why within the analytics/CMS system that is receiving the data.
| Platform | Cookie Name | Example Cookie Value | Query Parameter | Logic to Extract Relevent Portion of cookie value |
|---|---|---|---|---|
| Google Ads | _gcl_aw | GCL.123.Cj0KCQiAn4SeBhCwARIsANeF9DGye | ?gclid=Cj0Ketc | Last Part |
| Google Analytics | _ga | GA1.1.123456789.987654321 | n/a | Last 2 Parts |
| Meta (Facebook) | _fbc | fb.1.1699999999.ABCDEF123456 | ?fbclid=ABCDetc | Last Part |
| Microsoft Ads (Bing) | _uetmsclkid | _uetabcdef1234567890abcdef1234567890 | ?msclkid=abcetc | Remove 1st 4 characters from string |
| li_fat_id | C1234ABCD1234 | ?li_fat_id=C123etc | n/a (can use the cookie variable directly from GTM) | |
| Twitter Ads | _twclid | 123456abcdef | ?twclid=123etc | n/a (can use the cookie variable directly from GTM) |
| Pinterest Ads | _epik | C1234ABC | ?epik=C123etc | n/a (can use the cookie variable directly from GTM) |
Example to Get GA4 Client ID
To extract the GA4 Client ID which is the last 2 parts of the string GA1.1.1234.5678 would look something like the code below.
function() {
var cookie = {{GA4 Cookie}};
if (cookie && typeof cookie === 'string' && cookie.startsWith('GA')) {
return cookie.split('.').slice(-2).join('.'); //go to the end and get the last 2 parts
}
return ''; // Default fallback
}
Some Things To Consider
Hubspot Forms do not need to use this method as they have their own connectors for Google Ads that removes the need to do this
With Hubspot it is also not necessary for Facebook or LinkedIn, for the same reason.
Hubspot Forms can also be integrated to auto update customer match Contact Lists, Send Enhanced Conversions and Import Offline Conversions on Lifecycle Stage changes back to Google Ads
Do not test how forms populate with visible form fields as they have different safety mechanisms that often mean they will not allow form fields to be populated like this
As I found out after a lot of time-wasted as to why I could not get this to work initially!
If your querySelector works in the Console but the value cannot be written to then skip this step and test the set-up in GTM as the console or the form may be blocking access which may not be the case in a “real” situation
Pass Any Ad Click Id To Hidden Form Fields With GTM
Repeat the above process for any other Paid Ad Click coming from Microsoft Ads (MSA - Bing Ads), LinkedIn, Meta, etc.
Preview of Variables in GTM Preview Mode
GTM Variable | Variable Type | Value |
|---|---|---|
| Cookie - GA4 ClientID | 1st Party Cookie | "GA1.1.169232950.1730734883" |
| Cookie Value - GA4 ClientID | Custom JavaScript | "169232950.1730734883" |
| Cookie - Google Ads ClickID - gclid | 1st Party Cookie | "GCL.1736337107.xyzgoogle-ads" |
| Cookie Value - Google Ads ClickID - gclid | Custom JavaScript | "xyzgoogle-ads" |
| Cookie - MSFT Ads ClickID - msclkid | 1st Party Cookie | "_uetabc123" |
| Cookie Value - MSFT Ads ClickID - msclkid | Custom JavaScript | "abc123" |
| Cookie Value - LinkedIn ClickID - li_fat_id | 1st Party Cookie | "123linkedin" |
| https://domain.com/contact-us?gclid=xyzgoogle-ads&msclkid=abc123&li_fat_id=123linkedin |
The Landing Page URL is for testing & demonstrating only as the URL (in the table above) would never have all of these query parameters as any given ad click would come from a single ad platform at a time.
On your website, create hidden form fields and label them however you like:
2. In GTM, create 1st Party cookie variables for each ad platform by naming the cookie in the variable exactly as defined by the Ad Platform
3. In GTM, create corresponding JavaScript variables, to retrieve the relevant part of the cookie value that is typically appended by the platform in the query parameter of the URL:
3.1 This step is not needed for cookies that only store the exact value used e.g. the LinkedIn cookie value and that of the query parameter are the same so the 1P Cookie Variable can be used directly as it already holds the value needed
4. In GTM, bring all of this together with a custom HTML that uses a querySelector to identify the appropriate hidden form field and then populate its value from the custom variable
Useful Links Used While Writing This Post
LinkedIn Click ID documentation
Pinterest Cookie documentation
