The data layer is used by advanced developers and analysts in order to fully take advantage of a TMS.

To make it simple, data layers are most commonly used to access data which is not displayed on a page. The best example is the ecommerce analytics feature. When a customer validates an order, often the page confirming the product he or she bought shows the purchase amount, the number of products etc. But they are no longer listed on the page anymore. As a result, you need to find a way to make these values known to the Tag Manager. This can be achieved with the data layer. Learn more in this FAQ: How do I track Ecommerce interactions using the Tag Manager data layer?

Data layers are also a good way to make your data collection consistent. When using a Tag Manager, you are often defining variables based on the source code of your website, that’s the case when you are using DOM elements such as ID, classes etc. But what is going to happen if you change your source? Well, your tracking will break.
A data layer is solving this issue by ensuring that the data has been properly collected right at the beginning of the page.

Using a data layer means that you’re inserting extra source code within the content of your web pages and cannot be inserted through the Tag Manager.

To include a data layer, you will need to add the following lines of code before your container tag:

<script>
var  _mtm =  _mtm || [];    
</script>

As this data layer is empty, you will need to insert an extra line of code in order to push variables into it, so it will look something like this if you’re hard coding it:

<script>
var  _mtm =  _mtm || [];
_mtm.push({'weather': 'sunny'});
</script>

Once defined, you will see straight away within the debug mode that your data layer has been populated with a new variable:

In the screenshot example above, we want to push the weather from the location of the user. As you would like this value to be dynamic, your developer will set something like this instead of inserting a static value:

<script>
var  _mtm =  _mtm || [];
_mtm.push({'weather': 'MY CODE HERE TO GET THE DATA FROM A WEATHER API'});
</script>

Once done, you can easily create a variable within Matomo Tag Manager in order to use this variable afterwards for any tag:

And then analyze it within Matomo Analytics as shown in the screenshot example below:

Note that if you want to migrate from Google Tag Manager to Matomo Tag Manager, our TMS supports data layers written in the Google Tag Manager format. As a result, if your data layer is written as:

<script>
  dataLayer = [{
    'variable-name': 'value'
  }];
</script> 

We will support it in the same way as a Matomo data layer.

Learn more about the data layer in this training video