Last active
March 6, 2025 17:25
-
-
Save jakebellacera/54d30aa662b706aecf633664b96c60a6 to your computer and use it in GitHub Desktop.
Simple HubSpot gclid tracking code integration
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// The script below will ensure that gclid parameters are associated with | |
// contacts in HubSpot. | |
// | |
// A few things are required before this script will work: | |
// | |
// * You will need to have the HubSpot tracking code installed on the page. A | |
// few modifications will be required if you don't have the tracking code | |
// installed. Additionally, you will lose out on the built-in cross-domain | |
// features that the hubspot tracking code uses to store cookies. | |
// * You will need to have this script installed on every page. | |
// * Your HubSpot form(s) must have a hidden gclid field added to them. This is | |
// required so that the gclid parameter can be associated to the contact. | |
// | |
// How it works: | |
// | |
// 1. We check if the gclid parameter is present in the URL. If the gclid | |
// parameter is present and a HubSpot form is embedded on the page, then the | |
// HubSpot form embed code will automatically populate any form fields named | |
// "gclid" with the value. In case the user doesn't convert right away, or | |
// needs to visit another page to convert, then we cookie the gclid value to | |
// save it for later. | |
// 2. We then need to make sure that the hidden "gclid" field on your HubSpot | |
// form is set to the gclid parameter value. This way when the user submits | |
// is associated with the contact. HubSpot will automagically do this if the | |
// current page's URL has a gclid parameter visible. For other pages, we'll | |
// need to reference the cookie. | |
// 3. Upon form submit, we remove the cookie. This is just to keep things tidy. | |
// If the user revisits the site from a paid ad, the gclid parameter will be | |
// updated again. | |
// | |
// Some things to keep in mind: | |
// | |
// * If the user clicks on an ad, doesn't convert, and then clicks on another | |
// ad, the gclid value in the cookie will be overwritten. This shouldn't be a | |
// problem since the second ad in this case should be getting the credit for | |
// the conversion anyway. | |
// * This script should be executed on the page *after* the HubSpot tracking | |
// code has been initialized. | |
_hsq.push(function(hstc) { | |
var cookieName = "gclid"; | |
var gclid; | |
var gclid_matches; | |
// 1 | |
if (/gclid=/.test(window.location.search)) { | |
gclid_matches = window.location.search.match(/gclid=(\w+)/); | |
if (gclid_matches.length) { | |
hstc.cookie.set(cookieName, gclid_matches[1], { | |
daysToExpire: 365 | |
}); | |
} | |
} else { | |
// 2 - this only needs to be ran if the current page does not have a gclid parameter | |
gclid = hstc.cookie.get(cookieName); | |
if (gclid) { | |
$("[name='gclid']").val(gclid).change(); | |
} | |
} | |
// 3 | |
window.addEventListener("hsvalidatedsubmit", function(e) { | |
hstc.cookie.remove(cookieName); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi Jake, Brilliant work! Just to confirm, this will only work if the form is set as raw HTML form as opposed to iframe? If so, do we have any idea how we can go about achieving the same result for those using iframes?