Google Ads are great, but it doesn’t give you all the detailed information about how your visitors interact with your website. Without this type of data, it can be difficult to understand what content resonates and where there may be room for improvement. This blog post will show you easy ways to track Google Gclid in Webflow so that you can get a deeper understanding about how people interact with your site once they are on it.

What’s a GCLID?

Gclid, short for Google Click Identifier, it is a unique tracking parameter that Google uses to transfer information between your Google Ads account and your Google Analytics account.

Webflow form example

Step 1

Embed a HTML Element into your Webflow form

Step 2

Input this code into the HTML Embed

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

Step 3

Input this code in the Head code on your Webflow project settings 

<script>

function getParam(p) {

var match = RegExp('[?&]' + p + '=([^&]*)').exec(window.location.search);

return match && decodeURIComponent(match[1].replace(/\+/g, ' '));

}

function getExpiryRecord(value) {

var expiryPeriod = 90 * 24 * 60 * 60 * 1000; // 90 day expiry in milliseconds

var expiryDate = new Date().getTime() + expiryPeriod;

return {

value: value,

expiryDate: expiryDate

};

}

function addGclid() {

var gclidParam = getParam('gclid');

var gclidFormFields = ['gclid_field', 'foobar']; // all possible gclid form field ids here

var gclidRecord = null;

var currGclidFormField;

var gclsrcParam = getParam('gclsrc');

var isGclsrcValid = !gclsrcParam || gclsrcParam.indexOf('aw') !== -1;

gclidFormFields.forEach(function (field) {

if (document.getElementById(field)) {

currGclidFormField = document.getElementById(field);

}

});

if (gclidParam && isGclsrcValid) {

gclidRecord = getExpiryRecord(gclidParam);

localStorage.setItem('gclid', JSON.stringify(gclidRecord));

}

var gclid = gclidRecord || JSON.parse(localStorage.getItem('gclid'));

var isGclidValid = gclid && new Date().getTime() < gclid.expiryDate;

if (currGclidFormField && isGclidValid) {

currGclidFormField.value = gclid.value;

}

}

window.addEventListener('load', addGclid);

</script>

Save changes and publish your project. 

Step 4

Add /?gclid=TeSter-123 to the end of your domain, press entre so that the URL loads with the Gclid paramita added. 

http://www.example.com/?gclid=TeSter-123

‍

Step 5

Fill in the form and submit!