Skip to content

Instantly share code, notes, and snippets.

@zackphilipps
Last active May 16, 2023 22:05
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zackphilipps/a63ae55f13b06c1b443e755fa8e8404f to your computer and use it in GitHub Desktop.
Save zackphilipps/a63ae55f13b06c1b443e755fa8e8404f to your computer and use it in GitHub Desktop.
Pass Tracking Parameters to a Form on Another Page Using GTM – https://zackphilipps.dev/posts/store-gclid-cookie-send-to-hubspot/
// Pass Tracking Parameters to a Form on Another Page Using GTM
// https://zackphilipps.dev/posts/store-gclid-cookie-send-to-hubspot/
/**
* Assigns the supplied URL parameter to a cookie and each form field with a name that matches.
* You can keep calling this function multiple times for each URL parameter you want to pass along, e.g.
*
* window.onload = function () {
* assignTrackingParameterToCookie("gclid", "hubspot");
* assignTrackingParameterToCookie("utm_source", "gform");
* assignTrackingParameterToCookie("<YOUR_UTM>", "<YOUR_FORM_TYPE>");
* };
*
* @param {string} fieldParam - The name of the URL parameter. In this case, `gclid`.
* Could also be any UTM parameter such as `utm_source`.
* MUST match the input name (HubSpot)
* or one of its CSS classes (Gravity Forms).
* @param {string} formType - The type of form. Currently only supports 'hubspot' (the default)
* or 'gform'.
*/
function assignTrackingParameterToCookie(fieldParam, formType = 'hubspot') {
var field = getParam(fieldParam),
inputs
if (field) {
setCookie(fieldParam, field, 365)
}
/**
* Add other form types / input query selectors here.
*/
if (formType === 'gform') {
inputs = document.querySelectorAll('.' + fieldParam + ' input[type="text"]')
assignCookieValueToFormInput(fieldParam, inputs)
} else if (formType === 'hubspot') {
inputs = document.querySelectorAll('.hs-input[name="' + fieldParam + '"]')
assignCookieValueToFormInput(fieldParam, inputs)
}
/**
* Do not edit.
*/
function assignCookieValueToFormInput(fieldParam, inputs) {
var field = getCookie(fieldParam),
length = inputs.length
if (field && length) {
for (var i = 0; i < length; i++) {
inputs[i].value = field
}
}
}
/**
* Utility functions. Do not edit.
*/
function getCookie(name) {
var value = '; ' + document.cookie
var parts = value.split('; ' + name + '=')
if (parts.length == 2) return parts.pop().split(';').shift()
}
function setCookie(name, value, days) {
var date = new Date()
date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000)
var expires = '; expires=' + date.toGMTString()
document.cookie = name + '=' + value + expires + ';path=/'
}
function getParam(p) {
var match = RegExp('[?&]' + p + '=([^&]*)').exec(window.location.search)
return match && decodeURIComponent(match[1].replace(/\+/g, ' '))
}
}
/**
* Example usage!
* `window.onload` is necessary to ensure all form fields have loaded.
*/
window.onload = function () {
assignTrackingParameterToCookie('gclid', 'hubspot')
assignTrackingParameterToCookie('utm_source', 'gform')
assignTrackingParameterToCookie('<YOUR_UTM>', '<YOUR_FORM_TYPE>')
}
@Cdwenzel
Copy link

Line 21 triggers an error in GTM. I changed it to function assignTrackingParameterToCookie(fieldParam, formType) { and everything else worked as expected. Thanks for this!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment