Google Tag Manager is a tool that allows you to quickly and easily adjust tracking and marketing automation scripts for your pages from one centralized place.

For more info on Google Tag Manager check out Google's documentation here.

The step-by-step guide

Add the steps involved:

  1. Get your google tag manager container id.
  2. Integrate your container id with Deskera CRM.
  3. Using GTM to track form submission.

Step 1: Get your google tag manager container id

You’ll need your container ID, which you can obtain from your GTM page, follow Google’s instructions to obtain this ID, and copy and save it for Step Two.

Step 2: Integrate your container id with Deskera CRM

  1. Login to the Deskera CRM and integrate your GTM Container ID with Deskera CRM via Integration setting as follows,
Add GTM Container ID

2. Now  Add and Publish the form from Marketing > Forms and add the embedded code into your web page.

3. The Embedded form script will automatically Install Google Tag Manager on your web site.

Step 3: Using GTM to track form submission.

Now that you’ve integrated GTM with the Deskera CRM, you can track your Form Submission on your Webpage by setting up an event trigger within GTM,

Deskera web forms uses AJAX to submit form, which requires us to setup a Tags, a Trigger and an User define variable within GTM.

Here is the Step by step guide to do that:

  1. Go to google tag Manager and Tag → New → Tag Configuration,

Inside Tag Configuration Select Custom HTML and inside that paste the following code and Name the Tag 'Form Submit'

<script id="gtm-jq-ajax-listen" type="text/javascript">(function(){'use strict';var $;var n=0;init();function init(n){if(typeof jQuery!=='undefined'){$=jQuery;bindToAjax();}else if(n<20){n++;setTimeout(init,500);}} function bindToAjax(){$(document).bind('ajaxComplete',function(evt,jqXhr,opts){var fullUrl=document.createElement('a');fullUrl.href=opts.url; var pathname=fullUrl.pathname[0]==='/'?fullUrl.pathname:'/'+fullUrl.pathname; var[0]==='?'?;var queryParameters=objMap(queryString,'&','=',true);var headers=objMap(jqXhr.getAllResponseHeaders(),'n',':'); var{};dataLayer.push({'event':'ajaxComplete','attributes':{'type':opts.type||'','url':fullUrl.href||'','queryParameters':queryParameters, 'pathname':pathname||'','hostname':fullUrl.hostname||'','protocol':fullUrl.protocol||'','fragment':fullUrl.hash   ||'', 'statusCode': jqXhr.status|| '',' statusText': jqXhr.statusText||'','headers':headers,'timestamp':evt.timeStamp|| '','contentType':  opts.  contentType||  '','    formData':formData,'response':(jqXhr.responseJSON||  jqXhr.responseXML||   jqXhr.responseText||'')}});});} function objMap(data,delim,spl,decode){var obj={};if(!data||  !delim||!spl){return{};} var arr=data.split(delim);var i;if(arr)  {for(i=0;i<arr.length;i++){var item=decode?decodeURIComponent(arr[i]):  arr[i];var pair=item.split(spl);var key=trim_(pair[0]);  var value=trim_(pair[1]);if(key&&value){obj[key]=value;}}} return obj;} function trim_(str){if(str){return str.replace  (/^[suFEFFxA0]+|[suFEFFxA0]+$/g,'');}}})();</script>

In Triggering Select All Pages, this will track all the AJAX calls on the Webpage.

2. Now Next Step is to define a variable that will help us to Identify the web form submission,

In Google Tag Manager goto Variables → User-Defined Variables → New, add a variable Named 'Form Success Code'

In Tag Configuration Select Data Layer Variable as variable type and add attributes.response.code in variable name, rest keep as it is.

This User Defined Variable will help us to distinguish the right AJAX call to track, and then we can skip other AJAX calls in the webpage (if any).

3. Now for the third and final step,

- we will set up a trigger Follow Google's instructions on how to set up custom event triggers.
-  Set Trigger Type - Custom Event, Event Name - ajaxComplete, and for This trigger fires on → Some Custom Events → Add a Condition Where  Form Success Code Equals CRM_FORM_001

-  Now you can use this trigger to track form submission using Google Analytics, Google AdWords and many more in GTM.

Note :

  • We use AJAX to submit Web Form.
  • It is difficult to track form submission via conventional way.
  • If you need to track form submission you must setup your Google Tag Manager as mentioned in this article.

If you want a little help with Google Tag Manager, check out Tag Manager Help below:

Google Tag Manager Help Centre