Contents x
      Data Layer
      • 2 Minutes to read
      • Print
      • Dark
        Light
      Contents

      Data Layer

      • 2 Minutes to read
      • Print
      • Dark
        Light
      Article summary

      Data is essential to thoroughly analyze web pages concerning visitor activities and performance. Website operators, therefore need to collect qualitative user information to be able to evaluate and report, and subsequently respond to customer requirements. The implementation concept of a data layer offers a proven method to collect various data in a standardized way.

      The data layer is an abstract entity in the form of a JavaScript object. For web pages, it takes the form of a JavaScript array that contains "parameter: value" pairs. While the parameter name is static and is used across all the pages on the site, the value is replaced at every page with the actual data that correspond to that specific page. With this concept, it is ensured that the same data layer elements contain the same type of data consistently across all the pages of your website.

      Data layers enable a central provision of all data that can be used for tracking with Mapp Intelligence, as well as for all third-party tags or plugins. This applies equally to categories, which is static information that will be recorded only once (for example, a product belongs to the category 'sports article'), as well as for parameters, which is dynamic information (for example, payment method of a customer).

      Data layer elements must consistently use the same type of information on all pages to ensure a correct measurement. This means that whenever you use an item (for example, "UserId"), it must always contain the same kind of data across all pages, where it is collected.

      For detailed specification of a data layer, please also refer to the official W3C Data Layer Specification.

      Example Consistent Data Layer

      The following data layer example illustrates the consistency of information on all pages:

      Page

      Home

      Section 1

      Login

      Product A

      Product A Details

      JavaScript Example

      Data Layer Element







      Page Name


      en.home

      en.section1

      en.login

      en.product

      en.productDetail

      window._ti['pageName'] = '<PAGE NAME>';

      Product




      Product A

      Product A

      window._ti['product'] = '<PRODUCT NAME>';

      Client ID



      1234

      1234

      1234

      window._ti['clientId'] = '<CLIENT ID>';
      window._ti['pageName'] = 'en.home';

window._ti['pageName'] = 'en.section1';

window._ti['pageName'] = 'en.login';
window._ti['clientId'] = '1234';

window._ti['pageName'] = 'en.product';
window._ti['product'] = 'ProductA';
window._ti['clientId'] = '1234';

window._ti['pageName'] = 'en.productDetail';
window._ti['product'] = 'ProductA';
window._ti['clientId'] = '1234'; 

      The following code snippet shows an example of an implemented data layer for an online shop's website:

      Example

      <html>
	<head>
		<script>
			window._ti = window._ti || {};
			window._ti['contentId'] = 'shop.ladies.blouses';
			window._ti['contentGroup'] = {
				1: 'ladies',
				2: 'outerwear'
			};
		</script>
		<script src="/js/tiLoader.min.js"></script>
	</head>
	<body>
		... 
	</body>
</html>

      Note the following for integration with Tag Integration: once you have initially implemented a data layer according to your specifications, the mapping of the parameters has to be made in Mapp Tag Integration (which is described in the chapter Adding Tag Integration-Parameters). Otherwise, the values are not used for tracking. Furthermore, the data container has to be configured to define the distribution of data.

      Was this article helpful?
      What's Next