Data Layer Basics

Core concepts

The Data Layer is a simple but powerful array that enables communication with the Amplink application. Każde polecenie do naszej Data Layer jest przekazywane za pomocą metody push().

window._amplinkDataLayer.push(objectParam);

Currently only object are accepted as 'push' method param type. The definition of an object shows us two types of behavior:

• collecting custom context data which will be used in future raised events
• pushing events

Collection context data

Very often there is a need to collect contextual data that will be transferred to events. Such data may indicate, for example, whether the user is logged in, what language he uses in the application, what theme he has chosen (dark, light) or any other information we want to collect.

The Data Layer allows us to incrementally add this information to a stack that is held from the moment we enter the page to the moment we exit or refresh the page.

Let's take as an example a case in which we would like to store the following data for each collected event within our SPA application:

{
  "themeColor": "dark",
  "resolution": "mobile"
}

To build such a context data object, we add the following script when our page loads:

<script>
        window._amplinkDataLayer.push({
            themeColor: someFunctionToGetCurrentlySetThemeColor(),
            resolution: someFunctionToGetCurrentClientResolution()
        });
</script>

From now on, each event sent will contain the context data we have set.

Thanks to your own context data, you can track any parameters that interest you and build your own reports and charts based on these parameters.

info

You can update context any time you want and clear context variable by setting null as it value

warning

Please note that on a standard non-SPA website, the context you collect must be set every time the page is refreshed

Inbuilt metrics tracked

By default, Amplink tracks several parameters for you with each registered event and click on the link. These are:

• Sourced link - in cooperation with our link shortening mechanism, for each registered event we will assign the last link that brought the user to your website
• Source link redirected url - The link to which the user was last redirected if your shortened link uses A/B Testing or parameterized redirect link selection based on tracked parameters
• Referer - The page from which the user was redirected to your website. Useful if the user was redirected from an external website that does not have your shortened links
• Platform
• Browser
• Language
• Country
• City
• Day of the week
• Hour of the day

Pushing events

Once we have the context, we can start collecting events occurring on our website. So let's add an event telling us about the fact that the subscription has been purchased, the name of the package and the frequency of payments

The event is registered using the 'push' method. An object that is a parameter must have an 'eventName' field. Based on this, an event will be added in which you will be able to follow his repeated appearances.

<script>
        window._amplinkDataLayer.push({
            eventName: 'userRegistered',
            packageName: 'Premium',
            billingInterval: 'Annual',
        });
</script>

warning

Additional parameters indicated within the event object are not saved in the main context. This means that the data transferred to this event will only be transferred as part of a request to save this single event