Reporting & Analytics

markv
メンバー | Gold Partner
メンバー | Gold Partner

Tracking multiple Hubspot forms on a single page through Tag Manager

解決

I recently used this tutorial to set up form tracking via an event listener through GTM: https://www.3whitehats.com/knowledge/tracking-hubspot-forms-google-tag-manager/

 

I'm now at a point where I need to differentiate between 2 forms on one page. With the current set-up, a tag fires on both a standard contact form submit and a newsletter sign up. Anyone deal with this issue before/have any tips?

0 いいね!
1件の承認済みベストアンサー
IsaacTakushi
解決策
HubSpot Employee
HubSpot Employee

Tracking multiple Hubspot forms on a single page through Tag Manager

解決

Welcome, @markv.

 

You can modify the Custom HTML Tag with a JavaScript conditional statement to distinguish between the two form guid values:

 

<script type="text/javascript">
  window.addEventListener("message", function(event) {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
    	if (event.data.id == 'CONTACT-FORM-GUID-HERE') {
    		window.dataLayer.push({
        		'event': 'event-for-contact-form',
        		'hs-form-guid': event.data.id
     		 });
    	} else {
    		window.dataLayer.push({
        		'event': 'event-for-newsletter-signup',
        		'hs-form-guid': event.data.id
     		 });
    	}
    }
  });
</script>

Replace CONTACT-FORM-GUID-HERE with your contact form's guid. If you're not sure how to find it, check out this article.

 

Hope this helps!

Isaac Takushi

Associate Certification Manager

元の投稿で解決策を見る

0 いいね!
3件の返信
IsaacTakushi
解決策
HubSpot Employee
HubSpot Employee

Tracking multiple Hubspot forms on a single page through Tag Manager

解決

Welcome, @markv.

 

You can modify the Custom HTML Tag with a JavaScript conditional statement to distinguish between the two form guid values:

 

<script type="text/javascript">
  window.addEventListener("message", function(event) {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
    	if (event.data.id == 'CONTACT-FORM-GUID-HERE') {
    		window.dataLayer.push({
        		'event': 'event-for-contact-form',
        		'hs-form-guid': event.data.id
     		 });
    	} else {
    		window.dataLayer.push({
        		'event': 'event-for-newsletter-signup',
        		'hs-form-guid': event.data.id
     		 });
    	}
    }
  });
</script>

Replace CONTACT-FORM-GUID-HERE with your contact form's guid. If you're not sure how to find it, check out this article.

 

Hope this helps!

Isaac Takushi

Associate Certification Manager
0 いいね!
markv
メンバー | Gold Partner
メンバー | Gold Partner

Tracking multiple Hubspot forms on a single page through Tag Manager

解決

This works great! Thanks!

0 いいね!
IsaacTakushi
HubSpot Employee
HubSpot Employee

Tracking multiple Hubspot forms on a single page through Tag Manager

解決

Glad I could help, @markv!

Isaac Takushi

Associate Certification Manager
0 いいね!