|
// 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>') |
|
} |
Line 21 triggers an error in GTM. I changed it to
function assignTrackingParameterToCookie(fieldParam, formType) {
and everything else worked as expected. Thanks for this!