How to Integrate Google Client ID with a HubSpot Form

Matthias Kraaz

COO at Windsor.ai

8 January 2024

Integrating Google Client ID with a HubSpot form can be a complex task, especially if you are not a developer. However, with the right guidance and collaboration with a developer, you can achieve this integration successfully. Below is a step-by-step guide detailing how to perform this integration:

Steps for Integration

Create a Hidden Field in HubSpot Form
- Start by creating a hidden field in your HubSpot form. Name this field “google_client_id.” This field will be used to store the Google Client ID.
Implement the Script on Your Website
- Have a developer implement the following script on your website. It is crucial to review and verify the script with your IT team before implementation to ensure it is correctly set up and secure.

Script for Integration

<script>

window.addEventListener('load', function (event) {

function getClientId() {

try {

return window.ga.getAll()[0].get('clientId');

} catch (e) {

return false;

}

}

try {

var forms = document.querySelectorAll('form');

forms.forEach(function (frm) {

var el = frm.querySelector('input[name="google_client_id"]');

if (el) {

frm.addEventListener('submit', function () {

var ev = new Event('input', {

bubbles: true,

cancelable: true,

});

if (el) {

el.value = getClientId();

el.dispatchEvent(ev);

}

})

}

})

} catch(e) { console.error(e); }

})

</script>