HubSpot: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
|||
| (One intermediate revision by the same user not shown) | |||
| Line 41: | Line 41: | ||
} | } | ||
}); | }); | ||
</script> | |||
</pre> | |||
== GCLID Parameter == | |||
A hidden field will need to be set up specifically for the gclid. | |||
The the below will need to be added as a custom HTML: | |||
<pre> | |||
<script> | |||
function query_param_get( param ) { | |||
var paramsString = window.location.search; | |||
var searchParams = new URLSearchParams(paramsString); | |||
return searchParams.get( param ); | |||
} | |||
function store_value_once( key, val ) { | |||
if( key && val ) { | |||
if( typeof sessionStorage[key] == 'undefined' || !sessionStorage[key] ) { | |||
sessionStorage.setItem(key, val); | |||
} | |||
} | |||
} | |||
function get_value( key ) { | |||
if( sessionStorage[key] ) { | |||
return sessionStorage[key]; | |||
} | |||
return false; | |||
} | |||
if (typeof jQuery != 'undefined') { | |||
jQuery( function() { | |||
var gclid = query_param_get( 'gclid' ); | |||
if( gclid ) { | |||
// store gclid | |||
store_value_once( 'gclid', gclid ); | |||
} else { | |||
// attempt to retrieve gclid | |||
if( get_value( 'gclid' ) ) { | |||
gclid = get_value( 'gclid' ); | |||
} | |||
} | |||
if( gclid ) { | |||
if( typeof HubSpotForms != 'undefined' ) { | |||
hs_forms = HubSpotForms.getForms(); | |||
for( var i = 0; i < hs_forms.length; i++ ) { | |||
hs_forms[i].setFieldValue('google_click_id', gclid); | |||
} | |||
} | |||
} | |||
}); | |||
} | |||
</script> | </script> | ||
</pre> | </pre> | ||
Latest revision as of 14:31, 22 July 2026
Note: the hubspot form object could be either "HubspotFormsV4" or "HubSpotForms", this can bee seen in console
Tracking In Tag Manager
<script>
window.dataLayer = window.dataLayer || [];
//listener for older version (v3) of HS forms
window.addEventListener('message', function(event) {
if( event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted' ) {
window.dataLayer.push({
event: 'form_submission',
form_id: event.data.id,
conversion_id: event.data.data.conversionId,
form_data: event.data.data.submissionValues,
});
}
});
//listener for v4 HS forms
window.addEventListener('hs-form-event:on-submission:success', function(event) {
var hsform = HubspotFormsV4.getFormFromEvent(event);
if (hsform) {
hsform.getFormFieldValues().then(function(fieldValues) {
var transformedData = fieldValues.reduce(function(obj, item) {
var key = item.name.split('/')[1];
if (key) {
obj[key] = item.value;
}
return obj;
}, {});
window.dataLayer.push({
event: "form_submission",
form_id: hsform.getFormId(),
conversion_id: hsform.getConversionId(),
form_data: transformedData,
});
});
}
});
</script>
GCLID Parameter
A hidden field will need to be set up specifically for the gclid.
The the below will need to be added as a custom HTML:
<script>
function query_param_get( param ) {
var paramsString = window.location.search;
var searchParams = new URLSearchParams(paramsString);
return searchParams.get( param );
}
function store_value_once( key, val ) {
if( key && val ) {
if( typeof sessionStorage[key] == 'undefined' || !sessionStorage[key] ) {
sessionStorage.setItem(key, val);
}
}
}
function get_value( key ) {
if( sessionStorage[key] ) {
return sessionStorage[key];
}
return false;
}
if (typeof jQuery != 'undefined') {
jQuery( function() {
var gclid = query_param_get( 'gclid' );
if( gclid ) {
// store gclid
store_value_once( 'gclid', gclid );
} else {
// attempt to retrieve gclid
if( get_value( 'gclid' ) ) {
gclid = get_value( 'gclid' );
}
}
if( gclid ) {
if( typeof HubSpotForms != 'undefined' ) {
hs_forms = HubSpotForms.getForms();
for( var i = 0; i < hs_forms.length; i++ ) {
hs_forms[i].setFieldValue('google_click_id', gclid);
}
}
}
});
}
</script>