How to set up event collection in GTM to get ready for Facebook Conversion API

This document describes the prerequisites that need to be done in Google Tag Manager in order to prepare an export to Facebook Conversion API.

The reason is that the event ID should be the same for the Meiro Event tracking function and the same for the Facebook tracking function for every event. 

Users need to define id in various ways:

• Uuid or external uuid library, 
• A mix of form id and timestamp when it was sent and pass it to both functions.

If that is set correctly, data analysts can sync the basics of this function.

Warning: Each event needs to have a unique event id. 

The main points are:

1. Define one tag for each event e.g.  transaction or addToCart event.
2. Generate uuid or some other unique event_id identifier.
3. Send both events, MeiroEvents.track(…) & fbq('track'…) and use the same generated event_id.
4. Recommended to add event_name in the payload for MeiroEvents.track(...) as one of the custom fields. The event_name needs to match the event being tracked by the FB Pixel in fbq(track, event_name … ). With this, the analyst doing the implementation can pick up the event_name from Meiro events when sending it to the FB Conversion API. Without this in the payload, there needs to be predefined logic to map Meiro events to the tracked FB Pixel event name.  

Learn more: about FB Pixel and server event deduplication: here

There must be 3 types of events set in order to track additional events:

1. FB Pixel integration firing on all pages is just the initialisation script that you will get from Facebook.
2. ME Init is the SDK initialisation script that you can find in our docs here.
3. UUID dependency tag imports library for creating event id, but something different can also be used, e.g. unique form id + timestamp when a user sent it.

Warning: Those 3 tags must be in place in order to set other tags for particular events. Each event must have a unique tag. E.g. if you set multiple forms submitted, each must have its own tag set. 

Below is an example of the setting for the form submit type of event.

Events - Form submit - Newsletter is triggered by newsletter form submission and is set up in the following way:

<script>  
var uuid = uuidv4();  
var email = $(".sib_signup_form input[name=email]").val();  
var firstName = $(".sib_signup_form input[name=FIRSTNAME]").val();  
var lastName = $(".sib_signup_form input[name=LASTNAME]").val();  
var country = $(".sib_signup_form input[name=COUNTRY]").val();    

if (typeof MeiroEvents === "object") 
{    
  MeiroEvents.track("contactFormSubmit", {     
    form_id: "nl_signup_form",     
    email: email,      
    first_name: firstName,     
    last_name: lastName,      
    field00: uuid,      
    field01: country,      
    field02: "formSubmit" //note that the name matches exactly with the fbq event    
  });  
}    
if (typeof fbq === "function") {    
  fbq('track', 'formSubmit', {}, {eventID: uuid});  
}
</script>

When the tag is triggered, it creates uuid (defined in the code above field00: uuid and  {eventID: uuid}), extracts user filled data from form inputs and then sends both Meiro Events and Facebook events with the created uuid.

 

How to test if it works

Check Facebook Pixel helper (extension to Chrome) where events are sent to Facebook Pixel. Then, check the event id and you can compare it to the Meiro Events tracking calls from the network tab if it matches (browser console). 

If it matches, the implementation went well.