If you use Google Universal Analytics (UA) on your website, then you can integrate Freshmarketer with UA to get results on your experiments along with the web metrics collected by UA.



Why should you integrate Freshmarketer and UA?


Integrating Freshmarketer with UA allows you to

  • View web metrics tracked by UA for each variation in an experiment (running on Freshmarketer)

  • View reports in UA by filtering out only the visitors included in your Freshmarketer experiment

  • Understand how Freshmarketer experiments impact the metrics tracked by Google Analytics



Follow the steps outlined below to successfully integrate UA with Freshmarketer


STEP 1:

Ensure Freshmarketer JS Snippet is inserted in your website Header


If you haven’t inserted it yet, Please follow the below help docs to know How to insert Freshmarketer JS snippet into your website 

  1. Add Freshmarketer Snippet to Your Website

  2. Developer’s Guide to Verify Installation of Freshmarketer Snippet


STEP 2:

After Installing Freshmarketer JS snippet, GA JS Snippet needs to be inserted just below the Freshmarketer JS Snippet


<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script>


In the above snippet replace the ID with your GA tracking ID, You can find your Google Analytics Tracking ID by Logging to your Google Analytics account => Admin => Under Property => Choose Tracking info JS => you can see your UA ID at the top (refer screenshots)






STEP 3:

After inserting Freshmarketer JS Snippet & GA code Snippet, Now custom dimension needs to be created 

It is very important to create a custom dimension in UA to ensure Freshmarketer data is accurately mapped in UA.


Log in to your UA account. Navigate to the ‘Admin’ tab and select "Custom Dimensions"


Selecting "Custom Dimensions"



Create a new ‘Custom Dimension’





Creating New "Custom Dimensions"

  1. Use one custom dimension per experiment to prevent any kind of ambiguity.

  2. Keep a track of the dimension parameter after creating the custom dimension you created (see below)


Generate GA Code


STEP 4:

Freshmarketer's GA Code Integration


There are two types of Freshmarketert's GA code provided based on its own distinct purpose:

  1. GA integration for A/B testing & Personalization

  2. GA integration for all features (Heatmaps, split URL testing and much more)

  3. GA integration for a specific experiment


GA Integration for A/B Testing:


To send Freshmarketer's A/B testing data to your GA account, copy the below code and then replace the GA Tracking ID with your GA Account Tracking ID & Dimensionindex value which we noted while creating custom dimension in the STEP 3


<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config', 'GA_TRACKING_ID', {

'custom_map': {'dimensionIndex': 'zarget'}

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + exps[0]['experimentName'] +' : ' + exps[0]['appliedVariationName']});

}

});

</script>


Note: Replace GA_Tracking_ID in the code with your tracking ID & Replace Index with Custom dimension ID. Paste Freshmarketer's JS code followed by GA's tracking code and Freshmarketer's GA integration code.


Once you replace, your final code will look like below:


Final Example code for AB Testing & Personalization:


<script src='//cdn.freshmarketer.com/1213XX/237XX4.js'></script>   //**Freshmarketer JS code**

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script> 

<script>   //**GA Tracking code**

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config', 'UA-4428xxx2-1', {   //**GA Tracking ID**

'custom_map': {'dimension1': 'zarget'}  //**Dimension value “1” we noted in step 3**

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + exps[0]['experimentName'] +' : ' + exps[0]['appliedVariationName']});

}

});

</script>



GA Integration for all Features:


To send Freshmarketer's data of other features such as heatmaps and split URL testing, copy and paste the following integration code.


<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config','GA_TRACKING_ID', {

'custom_map': {'dimensionIndex': 'zarget'}

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

});

}

});

</script>





Note: Replace GA_Tracking_ID in the code with your tracking ID. Replace Index with custom dimension index in GA. Paste Freshmarketer's JS code followed by GA's tracking code and Freshmarketer's GA integration code.




Once you replace, final code will look like below:


Final Example code for all other features:


<script src='//cdn.freshmarketer.com/1213XX/237XX4.js'></script>   //**Freshmarketer JS code**

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script> 

<script>    //**GA Tracking code**

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config','UA-4428XXXX-1', {   //**GA Tracking ID**

'custom_map': {'dimension1': 'zarget'}      //** Customer dimension value we noted in STEP 3 **

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

});

}

});

</script>


GA Integration for a Particular Experiment:


To track Freshmarketer's data of a particular experiment or campaign, copy and paste the following GA integration code, you can find your experiment ID in the summary tab of your experiment refer screenshot 



<script>

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config','GA_TRACKING_ID', {

'custom_map': {'dimensionIndex': 'zarget'}

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.id === XXXX){                 =========> //**obj.id is Hash ID of your experiment**//

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

}

});

}

});

</script>




Note: Replace "XXXX" in the above code with the hash id present in the Preflight -> Experiment Info



Once you replace values, final code will look like below:


Final Example code for Specific experiment:


<script src='//cdn.freshmarketer.com/1213XX/237XX4.js'></script>   //**Freshmarketer JS code**

<script src="https://www.googletagmanager.com/gtag/js?id=UA-4428XXXX-1"></script>

<script>    //**GA Tracking code**

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.push(arguments);}

gtag('js', new Date());

gtag('config',”UA-4428XXXX-1”, {         //**GA Tracking ID**

'custom_map': {'dimension1': 'zarget'}     //** Customer dimension value we noted in STEP 3 **

});

$( document ).ready(function() {

var exps = window.zargetAPI?window.zargetAPI.getAllRunningExperiments() : [];

if(exps.length){

$(exps).each(function(i,obj){

if(obj.id === "425350525A514XX159535D564XXC5D5C58XX5B5B"){   ==> //**obj.id is Hash ID of your experiment**//

if(obj.type == 1 || obj.type == 4){

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName'] +' : ' + obj['appliedVariationName']});

}else{

gtag('event', 'zargetdimension', {'zarget': 'Zarget' + obj['experimentName']});

}

}

});

}

});

</script>



STEP 5:   


Once the data started collected, navigate to your Google Analytics account => Behavior => Events => Top Events


Click on the Secondary dimension and choose the custom dimension you created earlier. Now you should be able to see the Variation wide data which is created in Freshmarketer through GA









Technical Support 

 Don't see what you're looking for? Just drop us a mail