Creating and leveraging tailor-made web tracking through dataLayer

The importance of collecting precise and relevant data cannot be overstated. One way to achieve this is by using a dataLayer. In this guide, we’ll explore the concept of a dataLayer, its benefits, and how it can be implemented for tailored web tracking. We’ll also explore real-world examples using both Google Analytics 4 (GA4) and Matomo.

Understanding the dataLayer concept

Before we dive into the practical aspects, it’s crucial to comprehend the concept of a dataLayer. Essentially, a dataLayer is a JavaScript object that holds key information about user interactions on a website. This data can include page views, button clicks, form submissions, e-commerce transactions, and more. It acts as a bridge between your website and various analytics tools and ad platforms, facilitating the transmission of valuable information.

Benefits of Using a Datalayer

Data Consistency

A dataLayer ensures consistency in data collection across different analytics platforms and advertising platforms like Meta for example. Whether you’re using GA4 or Matomo, the data structure remains uniform.


It lets you define and collect specific data points that are essential for your business objectives. You can tailor your tracking to your unique needs.

Real-time Tracking

DataLayers enable real-time data tracking, allowing you to react promptly to user interactions and make informed decisions.

Implementing Datalayer for GA4 and Matomo

Setting up the dataLayer for GA4

Google Analytics 4 is a powerful analytics tool that leverages machine learning to provide deep insights into user behaviour. To set up adataLayer for GA4, follow these steps:

  1. If not already done, integrate the GA4 tracking script into your website’s HTML code.
<!-- GA4 Tracking Script -->
<script async src=""></script>
  1. Initialise GA4 in your JavaScript code and configure the dataLayer with relevant information.
// Initialise GA4
window.dataLayer = window.dataLayer || [];

// Push data to the datalayer
  'event': 'page_view',
  'page_title': 'Your Page Title',
  'page_location': 'Your Page URL'
  1. Create custom events within the dataLayer to track specific user interactions, such as button clicks or form submissions.
// Custom event example
  'event': 'custom_event',
  'event_category': 'Category',
  'event_action': 'Action',
  'event_label': 'Label'

Setting up the dataLayer for Matomo

Matomo, formerly known as Piwik, is an open-source web analytics platform that offers flexibility and data ownership. Here’s how you can set up a dataLayer for Matomo:

  1. If not already done, embed the Matomo tracking code into your website’s HTML, typically in the header or footer section.
<!-- Matomo Tracking Code -->
<script type="text/javascript">
  var _paq = window._paq || [];
  (function() {
    var u="//your-matomo-url/";
    _paq.push(['setTrackerUrl', u+'matomo.php']);
    _paq.push(['setSiteId', 'YOUR_SITE_ID']);
    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
  1. Use Matomo’s JavaScript API to push custom data to the dataLayer.
// Push custom data to the datalayer
_paq.push(['trackEvent', 'Category', 'Action', 'Label', 1]);

How to use tailor-made data

Once you’ve set up your dataLayer for GA4 and Matomo, you can start leveraging the tailor-made data it collects. This data can be used to:

  • Analyse user interactions to enhance website usability.
  • Track e-commerce transactions and goal completions.
  • Deliver personalised content and recommendations based on user behaviour.
  • Use real-time data to make data-driven decisions and refine your digital strategy.
  • Integrating advertising platform pixels with your dataLayer.

A dataLayer is a powerful tool that lets you create tailor-made web tracking solutions, ensuring that you gather the precise data required to drive your online success. Whether you opt for Google Analytics 4 or Matomo, implementing a dataLayer is a fundamental step towards achieving a better understanding of user behaviour and optimising your online presence.