Jump to content

FormBuilder and Google Analytics


JoshoB
 Share

Recommended Posts

So I've been using FormBuilder on client websites, but now they want to be able to track the form output using Google Analytics. 

I have no idea how they should go about this. Any suggestions that I could pass onto them? 

Thank you very much! 

Link to comment
Share on other sites

What do you mean by form output? Generelly, forms are used for input ?

The first step is to determine which interactions you want to track. For example, you could track an event:

  1. ... whenever a form is successfully submitted.
  2. ... whenever a form is partially filled but then abandoned.
  3. ... each time somebody fills out an individual field (will result in many events).
  4. ... whenever somebody finishes an individual step of a multi-step form.

Beyond that, you first need to determine what your client wants to know, in terms of specific metrics, interactions etc.

Most of those you can do with simple event handlers reacting to form changes, inputs and button clicks.

// find all formbuilder forms on the page
const FormBuilderForms = Array.from(document.querySelectorAll('form.FormBuilder'));
// track the submit button
FormBuilderForms.forEach(form => form.addEventListener('submit', e => {
  	// this assumes you're using gtag.js with transport mechanism 'beacon'
	gtag('event', 'form_submitted', {/** add additional information based on the form data */});
});

A bit more tricky is tracking submissions only after they've been validated server-side, since you can't catch that with JavaScript. However, after submitting a form you will usually show a success message or redirect to a dedicated thank you page, so you can just track those:

// FormBuilder uses this ID for the submission message
const FormBuilderSuccess = document.getElementById('FormBuilderSubmitted');
if (null !== FormBuilderSuccess) {
	gtag('event', 'form_submission_result', {/** track the name + result of this submission */});
}

Does that answer your question? It's just a matter of determining what you want to track, and then adding appropriate event handlers with JavaScript.

  • Like 2
  • Thanks 1
Link to comment
Share on other sites

  • 3 years later...

I get the struggle of integrating FormBuilder with Google Analytics, but worry not, you're not alone on this journey! If your clients are keen on tracking form output, you might want to explore DataHive360. It's been a game-changer for me in improving marketing efficiency, especially when it comes to analytics. As a newbie here, I stumbled upon this gem of a tool in my quest for better data insights. It seamlessly integrates with FormBuilder, making it a breeze to track and analyze form submissions through Google Analytics. The setup is pretty straightforward, and the detailed reports you get are a lifesaver.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...