Did You Know?

JENTIS is the only european Server Side Tracking Solution

Quick Start
Updated on 1 March 2022

Data Layer Parameter Variable

WARNING: This page is deprecated – please refer to JTM Variables to access values from the GTM Data Layer. Only use the following manual approach if absolutely required or as a reference for manual JS functions.

With Frontend Variables in your JTM account you can access any information in the frontend. Meaning the browser of your website visitors. Where all information like a page title, url or Data Layer value is at your fingertips.

Here comes a short guide on a accessing a common data container: the DataLayer.

Create a Frontend Variable

Simply add a Frontend Variable entry to your JTM account. In the JavaScript input field paste the following code.

In the upper section of this code you will find some controlling mechanism values. Those are:

  • PARAM_NAME (line 6)
  • EVENT_NAME (line 11)
  • OCC_POINTR (line 12)
  • DL_NAME (line 13)

The details of those values are discussed in the following section below. If you want to quick start: simply add the PARAM_NAME value you are looking for and you are ready to go.

function(){
  /**
   * The parameters name of which to return the value from.
   * Mandatory, empty String not allowed.
   */
  var PARAM_NAME = "my.object.key";
  
  /**
   * Further customization.
   */
  var EVENT_NAME = "";          // either empty String or the actual event value to match
  var OCC_POINTR = "last";      // use 'first' or 'last' to either select the first occurance of the parameter or the last found on iteration
  var DL_NAME    = "dataLayer"; // window pointer to the actual Data Layer object
  
  return get_dl_value_of(PARAM_NAME, OCC_POINTR, EVENT_NAME);
  
  /**
   * Access a dataLayer parameter as required. This convenience function
   * will look within the global dataLayer object and iterate it until a
   * certain parameter is found. The search conditions are defined by the
   * input parameters. Iteration starts at 0 ("first" is described as the
   * most early occurances in the dataLayer queue and "last" respectively).
   * @params pname {String}    The parameter name to look for.
   * @params opointer {String} Either "first" or "last" which either returns
   *                           the first or last occurance of the parameter
   *                           found in the dataLayer.
   * @params ename {String}    (optional) Event name that must be matched to
   *                           return the parameter value.
   */
  
  function get_dl_value_of(pname, opointer, ename){
    var dl = window[DL_NAME] || [];
    var r  = [];
    var pname_splt = pname.split(".");
    var root_pname = pname_splt[0];
    
    for(var i = 0; i < dl.length; i++){
      if((ename == "" || dl[i].event === ename) &&
          typeof dl[i][root_pname] !== "undefined")
        r.push(pname_splt.length > 1 ? pointer_parsing(dl[i], pname_splt) : dl[i][pname]);
    }
    
    if(opointer == "first")
      return r.length > 0 ? r[0] : "";
    else if(opointer == "last")
      return r.length > 0 ? r[r.length-1] : "";
    else
      return "unexpected opointer value";
  }
  function pointer_parsing(root_obj, keys){
    for(var i = 0; i < keys.length; i++){
      if(root_obj[keys[i]])
        root_obj = root_obj[keys[i]];
      else
        return null;
    }
    return root_obj;
  }
}

Detailed Settings Walkthrough

Here comes a little walkthrough on the parameters to control the output of this function.

Parameter Name

This is the key to your parameter search. If you look within your dataLayer object for foo in the following example, it will return “bar”.

dataLayer = [
{
  event: "test",
  foo: "bar",
  abc: {
    def: 2
  }
}
]

You can also use a nested reference with “.” notation, ie: “abc.def” will return “2”.

Event Name

If you choose an event name here it will narrow down your search to those Data Layer events you are looking for. Keep empty to search within all events of the Data Layer.

Occurence Pointer

The parameter you are looking for may be existing multiple times in different stages of the Data Layer. Our function expects a Data Layer in chronological order (as is in use with Google Tag Manager for example), where each event is pushed into the Data Layer one after another as they are processed. With the occurence pointer you can select either the “first” or “latest” value found in this order. Where first starts from the 0 index position of the Data Layer array and latest is the max. index found.

Data Layer Reference

In most cases this is the de fault standard value dataLayer – but if it differs for your website you can place here the actual name at the global window variable.

Leave a Comment