N.B.: the screenshots in this sheet are from October 2020, the interface and the Facebook Pixels platform change regularly so the appearance may not be the same. Nevertheless, the process should remain the same.

First of all, what is Google Tag Manager?

Google Tag Manager (GTM) is a tag management system that allows you to track more advanced data. GTM quickly updates and facilitates the tracking of data on applications or websites. It is an interface that allows you to create and view the tags you create. GTM is a Tag Management System, and works like a CMS (Content Management System) except that it is not for site content but for special tags.

You can track your data by linking your Google Tag Manager account to Google Analytics for example.

Why do we need Google Tag Manager?

The advantages of Google Tag Manager:

Why set it up for your bsport account?

To be able to analyse the behaviour of students and potential students when they are on the bsport platform linked to your account. You can analyse the different steps, clicks, sessions and others.

What are Facebook Pixels?

The Facebook Pixel is a piece of code that allows you to retrieve data from users who have visited your website in order to build an audience.

Why do we need Facebook Pixels?

The Facebook Pixel is used to optimise advertising campaigns on Instagram and Facebook, to analyse traffic to your site via Facebook, and to track purchase path and other data related to advertising.

Why to set it up for its bsport account?

To be able to analyse the behaviour of users after clicking on a Facebook or Instagram ad. To have the right data to optimize your marketing campaigns.

Now you know what Google Tag Manager and Facebook Pixels are, let's start this tutorial to link these two tools to your bsport platform.

The different steps to be able to get the bsport data:

For this tutorial you will need:

To link your Google Tag Manager account and bsport you only need two things:

To know your Google Tag Manager ID you just have to go to the GTM interface and find your ID.

You can find it here:

The number next to GTM is your ID.

Then, go to your bsport platform as an admin.

You must enter your Google Tag Manager ID in Settings > General > Google Tag ID

Now your bsport account and Google Tag Manager are linked.

Set up your Google Tag Manager account

Now you can set up your GTM account to track your platform data.

Google Tag Manager works with 3 settings:

You can now create tags in order to track the data on your bsport platform.

To analyse them, you must link your Google Tag Manager account to Google Analytics.

To create a tag in Google Tag Manager click on 'Tabs' in the left sidebar, then new.

After creating a Google Analytics account and linking it to Google Tag Manager, this is done automatically.

Then on the Google Tag Manager platform, you have to create a tag > Google Analytics: Universal Analytics

The configuration is done automatically and all you have to do is choose the variable and the trigger for the tag.

For the triggering of the tag you have to choose "All Pages" Page View, so that the tag is triggered each time it is viewed/uploaded on the platform.

Once done, you will be taken to a page that looks like this:

You can preview, check that the tag is triggered when viewed on the platform/on your site and publish!

This is the same principle for all other possible tags on Google Tag Manager.

Setting up your Facebook Pixels account

You need to have a Facebook Business Manager account, to manage ads and also to create and moderate Pixels. To create an account: https://business.facebook.com/overview

After creating an account, go to the Event Manager. From there you can create a Pixel.

You can create a Pixel for your site, for the platform, etc.

To do this you need to click on "Add Pixel", then a banner will appear with three possibilities:

Choose the Pixel to your site.

This pop up then appears displaying 3 options:

Choose one of the two options, we recommend the partner integration because it is easier.

You will then have this banner displayed:

Then instructions will be given according to the partner chosen and you can analyse your site's data with a few clicks.

You can also install the pixel code in all <head> of your site.

If you have an agency or webmaster, you can also send with "Send instructions by email".

Linking Pixels and Google Tag Manager

You can now link Google Tag Manager and Pixels.

By linking Google Tag Manager and Pixels, you can also link with bsport as the GTM tag was configured in step 1.

To connect Facebook Pixels to Google Tag Manager, it happens on the Facebook side.

Go to the Event Manager to create a Pixel.

As in the previous step, add a Pixel to your site and click on "Use a partner".

Then you select Google Tag Manager.

All you have to do is follow the steps and everything will be set up.

Your Pixel and Google Tag Manager are now connected.

Create Google Tag Manager tags to track Facebook ad data

We will now create GTM tags, linking them to a Pixel to track activity on Facebook Pixels.

First things first:

To allow Pixels to track events that happen on the bsport platform, you need to go through Google Tag Manager. That's why you connected Google Tag Manager and Pixels in the previous step.

You also need to make Google Tag Manager understand the events that happen on the bsport platform so that it can send them to Pixels.

It is necessary to create a variable on Google Tag Manager which corresponds to the bsport event.

Find all the bsport events here: https://pastebin.pl/view/23083ef7

We are now going to create the variable for a bsport event to be sent to Pixels.

For this example we will choose the click on add to cart event.

Let's create the variable. In Google Tag Manager, go to Variables > New.

Then create a new variable > Data Layer Variable.

Put "data" in the name of the data layer variable. Name the variable, for us it will be "dlv - data".

So we have this for the configuration:

We can now move on to configuring the tag.

In the Google Tag Manager platform, you can go to "Add a tag".

Then you can go to "Configure tag" and then to "Discover other types of tags".

Then you have to look for the "Facebook Pixel", and you can easily configure Pixels in GTM this way and not go through the manual code.

Then you have to configure the Pixel by naming it, putting an ID, choosing the event.

We will choose the Add to Cart event.

In the same way, you must configure the triggering of this tag. Go to "Trigger" at the bottom and configure it.

You need to create a trigger, to do this you need to click on the "+" at the top right and create a trigger. Then you have to configure a "Custom Event".

In "Object Properties", you must add the variable created earlier.

So add "dlv-data".

Then you have to configure the triggering of this tag. Go to "Trigger" at the bottom and configure it.

You need to create a trigger, to do this click on the "+" at the top right and create a trigger. Then you have to configure a "Custom Event".

From here we can name the trigger. "Add to Basket" for our example will work fine.

In "Item Name" we need to enter the bsport event we want to pull up. Our item being the add-to-cart, in the file attached higher in this form we know that the bsport event that corresponds to that is: bsport:basket:add-to-cart:pass

Don't forget to check the "Use regular expression matching" box.

The configuration is finished! You can save and switch to preview mode in Google Tag Manager. Google Tag Manager's preview or "debug" mode allows you to see the tags that are triggered on a website page. There is also the Chrome extension, Google Tag Assistant.

Go to your bsport marketplace and click on an add to cart of your platform.

In the GTM "Debug" you can see that the tag has been triggered.

You can also check if the Pixel has been activated with the Facebook extension Pixel Helper.

You can also check in the Facebook Pixel Event Manager:

There you go, you can now set up Google Tag Manager events related to your platform and pull them up in Pixels.