In this tutorial, You will learn how to track form submission with Google Tab Manager for Conversational Form Pro.

You can use Google Tag Manager to track form submission for Conversational Form Pro without needing to modify the code on your website. Here’s a brief overview of the steps we’re going to take to track form submission:

1. Choose a conversational form that you want to track.
2. Add a CSS Class to the last response of the form.
3. Create a tag
4. Create a trigger
5. Check Google Analytics
6. Publish the container

Before we begin, here are some things to check:

• We are assuming you’re already familiar with Google Tag Manager. If you’re just getting started then we recommend you to go through this tutorial.

• We are also assuming that you have a Google Analytics pageview tag configured inside Google Tag Manager. If not then please do it by following this tutorial

• We suggest using Google Chrome as you follow along. You can use another browser as well.

• We assuming that you have WoowBot & Conversation Form Pro installed and activate in your website.

Let’s get started!

1. Choose a Conversational Form that you want to track

Please click Bot – Form Builder from left admin menu. In this page you will see all your conversational form listed that you have created. If you have not created any form or you just get started then please follow this youtube video for quick get started with Conversational form.

For now, We are choosing Basic form to track the submission.

2. Add a CSS Class to the last response of the form

After clicking on the edit button, We have added a CSS class with with the last response for that conversational form. you can change the class name. Please see the screenshot.

3. Create a tag

Now it’s time to head to Google Tag Manager and create a tag. We can now create our tag which will send data to Google Analytics when our conversational form is completed. Select ‘Tags’, click ‘New’ and name your tag. For my example, I’m going to name the tag ‘Basic Conversation Form Submit Track’.

Then select ‘Tag Configuration’ and choose ‘Google Analytics’ as the ‘Tag Type’.

Select ‘Pageview’ and change this to ‘Event’. Now we can choose how we want the form submission to be reported inside Google Analytics.

I’ve entered ‘Conversational form’ as the ‘Category’, then ‘Form Submit’ as the ‘Action’.

Next, we need to select our Google Analytics settings variable.

Before we save our new tag, we need to add a trigger…

4. Create a trigger

Triggers tell Google Tag Manager when a tag should (or shouldn’t) fire. For our form submission tag we need to create a trigger so that the tag only fires when the conversational form is completed. To do this, we select ‘Triggering’ for the tag and then click the blue plus sign in the top right corner to create a new trigger.

Let’s name the trigger ‘Conversational form submission’, click ‘Tag Configuration’ and select ‘Element Visibility’.

Now need to change the “Selection Method” to CSS Selector. Add that CSS Class(you have added in conversational forms last reply) in Element selector field. Then select “Every time an element appears on screen” for When to fire this trigger field. Then enable the “Observe DOM changes” checkbox.

Next, we save the trigger, and then we save the tag.

5. Check Google Analytics

Now go to frontend and open the WoowBot by clicking on the bot icon and fill-up the conversational form.

Now go to google analytics and navigate to Realtime > Events page and you can see the event is get triggered and the data is captured.

You can create your own goal for this event from Admin > Goals page.

6. Publish the container

Once you see data for your conversational form submission inside Google Analytics, it’s time to publish the container to your website. To do this, head back to Google Tag Manager and click ‘Submit’ on the top right corner.

That’s it!

You’ll now we tracking form submission for Conversation Form Pro into Google Analytics.