Send event from hubspot to google analytics also set form field when google anlaytics cookie is set

SOLVE
Highlighted
New Contributor

Hi @IsaacTakushi  dear i am facing another problem in hubspot.How to send Events from hubspot to Google Analytics.. I want to set Form field if google analytics cookie is set.I embeded js code on form and add that form on landing page but it do not set form field(google_client_id) when i fill the form on landing page..can you solve this problem.please review my code.

In all Hubspot forms add "GA Client id" as an optional hidden field
Modify the script tag on all Hubspot forms to set ga_client_id if the GA cookie is set

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script> 
<script>
 function setGaClientId() {
 if ($('[name=ga_client_id]')[0]) { 
     $('[name=ga_client_id]').val(_((Cookies.get('_ga') || '').split('.')).takeRight(2).join('.')); 
     } 
 } 
 hbspt.forms.create({  
 css: '', 
 portalId: '', 
 formId: '', 
 onFormSubmit: setGaClientId 
 }); 
</script>

..Thank you

Reply
0 Upvotes
1 Accepted solution

Accepted Solutions
HubSpot Moderator

Hi, @zohaib.

 

Apologies for the delayed response.

 

With a Marketing Basic (legacy), Professional, or Enterprise subscription, you can use these options to manipulate form field values with jQuery.

 

For example, I used:

 

<script>
  var ga_client_id = "myValue";
  hbspt.forms.create({
        portalId: "",
	formId: "",
        onFormSubmit: function($form, ctx){
$('input[name="ga_client_id"]').val(ga_client_id).change(); } }); </script>

Form field manipulation is not possible with a Marketing Starter or Free subscription, however, as these forms render in an iframe.

 

Instead, you can auto-populate form fields with query strings.

Isaac Takushi

HubSpot Developer Support
Reply
0 Upvotes
4 Replies 4
HubSpot Moderator

Hi, @zohaib.

 

Apologies for the delayed response.

 

With a Marketing Basic (legacy), Professional, or Enterprise subscription, you can use these options to manipulate form field values with jQuery.

 

For example, I used:

 

<script>
  var ga_client_id = "myValue";
  hbspt.forms.create({
        portalId: "",
	formId: "",
        onFormSubmit: function($form, ctx){
$('input[name="ga_client_id"]').val(ga_client_id).change(); } }); </script>

Form field manipulation is not possible with a Marketing Starter or Free subscription, however, as these forms render in an iframe.

 

Instead, you can auto-populate form fields with query strings.

Isaac Takushi

HubSpot Developer Support
Reply
0 Upvotes
HubSpot Moderator

Hi, @zohaib.

 

To clarify, this approach to populating a Google Analytics client ID — which you discuss with @WendyGoh in this thread — will work for a Marketing BasicProfessional, or Enterprise form, but not for a Marketing Free or Starter form.

 

Marketing Free and Starter forms are rendered in an iframe through js.hsforms.net/forms/shell.js instead of js.hsforms.net/forms/v2.js, so they cannot be manipulated with jQuery or styled with on-page CSS.

Isaac Takushi

HubSpot Developer Support
Reply
0 Upvotes
New Member

Hi Isaac, 

I am trying to track conversions on google analytics based on hubspot form submissions on our website . I used the script you suggested:

 

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
var ga_client_id = "myValue";
hbspt.forms.create({
portalId: ",
formId: ",
onFormSubmit: function($form, ctx){
$('input[name="ga_client_id"]').val(ga-client_id).change();
}
});
</script>

 

However, it doesn't seem to work.  I have tried to use onFormReady instead of onFormSubmit, but doesn't work either.  Any suggestions? 

 

Also, is hyphen highlighted in red ->   $('input[name="ga_client_id"]').val(ga-client_id).change(); supposed to be an underscore? 

 

Thanks. 

Reply
0 Upvotes
HubSpot Moderator

Hi, @PierreDrouzine.

 

Yes, I mistyped the variable name as ga-client_id. It should be ga_client_id. I've corrected my previous post. Thanks for pointing that out.

 

Could you share an example page where you've implemented this script? Can you also confirm you're loading jQuery on the page?

Isaac Takushi

HubSpot Developer Support
Reply
0 Upvotes