--- title: "Data Layer Implementation Guide" slug: "data-layer-implementation-guide" updated: 2025-09-10T12:02:18Z published: 2025-09-10T12:02:18Z canonical: "docs.mapp.com/data-layer-implementation-guide" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.mapp.com/llms.txt > Use this file to discover all available pages before exploring further. # Data Layer Implementation Guide As mentioned before, the data layer builds the bridge between your website and analytics. The first implementation step is to place the data layer within the `<head>` section of each page on your retail website. This chapter contains a detailed description of the data layer to be implemented. > In the example provided here, we use Mapp's own [Tag Management solution](/v1/docs/mapp-tag-integration-pixel-v5). The integration of Mapp Intelligence tracking tags is possible with other Tag Management tools, for example Google Tag Manager (GTM). Just create the relevant data layers as needed. In GTM, the data layer is a combination of events and variables. ## Basic Data Layer The following data layer is required to track each page. #### Example ```javascript window._ti['pageName'] = location.hostname + location.pathname; window._ti['language'] = 'en'; window._ti['contentCategory'] = 'Home'; window._ti['contentSubcategory'] = 'Product overview'; window._ti['emailOptIn'] = 'yes'; window._ti['customerId'] = ''; ``` | Data Layer Variable | Description | | --- | --- | | ```javascript window._ti['pageName'] ``` | Contains the full URL of the page without the protocol (HTTP(s)) and parameters. | | ```javascript window._ti['language'] ``` | Contains the language version of the page, for example "de," "en," "it," "es." | | ```javascript window._ti['contentCategory'] ``` | Contains the content category. Possible values: - Checkout - Service - Catalog - Account - Home - Content | | ```javascript window._ti['contentSubcategory'] ``` | Contains the content subcategory. Possible values: - Corporate - Career - Customer service - Tools - Product overview - Product detail - Internal search - Landing page - Blog - Knowledge | | ```javascript window._ti['emailOptIn'] ``` | Indicates whether a user has decided to receive e-mail. It is user-related status information that can be tracked, for example when a user logs on or via a cookie. Possible values: - 1 = yes - 2 = no - 3 = unknown (default) | | ```javascript window._ti['customerId'] ``` | The encrypted e-mail of the user. Requires SHA256 hash encoding. | --- ## Data Layer for Product & Order Pages For the data layers of product and order confirmation pages, note the following points: - For the product and purchasing process, you must extend the data layer with additional information about the product and order details. - On product detail pages, it is necessary to track product-specific information such as product IDs and costs. - The order confirmation pages must track the user's entire purchase, including all product IDs, shipping costs, etc. ### Product Detail Pages The tracking of product-specific information such as product IDs and costs is relevant for the product detail pages. Therefore, in addition to the primary data layer for all pages, you must add the following data layer on all product detail pages of your website. #### Example ```javascript window._ti['productId'] = '1234n'; window._ti['shoppingCartStatus'] = 'view'; window._ti['productCost'] = '34.95'; window._ti['currency'] = 'EUR'; window._ti['productName'] = 'sneaker'; window._ti['productCategory'] = 'women'; window._ti['productSubcategory'] = 'shoes'; window._ti['productSoldOut'] = '0'; ``` | Data Layer Variable | Description | | --- | --- | | ```javascript window._ti['productId'] ``` | Contains the ID of the product as specified in the product catalog (usually the article number), for example, "1700851554," " LS721C08D-K11 ." | | ```javascript window._ti['shoppingCartStatus'] ``` | Indicates whether a product is viewed, added, or purchased. **view** = The status must be set to **view** if it is viewed but not placed in the shopping cart. **add** = The product is placed in the shopping cart but not yet purchased. To track the status of **view** and **add** in Mapp Intelligence accordingly, it is necessary to force a tracking request to Mapp Intelligence when the user places the product in the shopping cart by clicking on "Add to Cart" function. The data layer must be updated with the following values before calling "Send Page Update": ```javascript window._ti['pageName'] = 'add-to-cart; window._ti['productQuantity'] = '2'; window._ti['contentCategory'] = 'add-to-cart'; window._ti['contentSubcategory'] = 'add-to-cart'; window._ti['shoppingCartStatus'] = 'add'; wts.push(['send','pageupdate']) ``` JS 'productQuantity' indicates how many items of the product have been added to the cart. | | ```javascript window._ti['productCost'] ``` | Contains the cost of the product. Product costs must be equal to the gross value of the product, including taxes and other charges. | | ```javascript window._ti['currency'] ``` | Contains the currency as an ISO 4217 standard value in which the product is displayed. | | ```javascript window._ti['productName'] ``` | Contains the product title or another descriptive name of the product. | | ```javascript window._ti['productCategory'] ``` | Contains the product category, for example **women**, **men**, **furniture**, and so on. | | ```javascript window._ti['productSubcategory'] ``` | Contains the subcategory of the product, for example, **Shoes**, Trousers, Cupboards, and so on. | | ```javascript window._ti['productSoldOut'] ``` | Displays the inventory status of a product. **0** = The product is sold out. | ### Order Confirmation Pages In addition to the primary data layer for all pages, the following data layer must be added to all order confirmation pages that are displayed after a successful purchase. #### Example ```javascript window._ti['productId'] = 'pullover;jeans'; window._ti['productCost'] = '99.90;69.95'; window._ti['productQuantity'] = '2;1'; window._ti['shoppingCartStatus'] = 'conf'; window._ti['totalOrderValue'] = '52.99'; window._ti['currency'] = 'EUR'; window._ti['orderId'] = 'M-12345'; window._ti["birthday"] = '20000723'; window._ti['gender'] = '1'; window._ti['couponValue'] = '10.00';   ``` > [!WARNING] > If there are multiple values for a variable, separate the values with a semicolon. | Data Layer Variable | Description | | --- | --- | | ```javascript window._ti['productId'] ``` | Contains all product IDs of the purchase. > [!WARNING] > The ID must be identical to the ID used in the product catalog. | | ```javascript window._ti['productCost'] ``` | Contains the individual costs per item. | | ```javascript window._ti['productQuantity'] ``` | Displays the number of items purchased from each product. | | ```javascript window._ti['shoppingCartStatus'] ``` | Indicates that the order transaction has been confirmed. Must be set to **conf**. | | ```javascript window._ti['totalOrderValue'] ``` | Contains the total order value of the purchase, including all ancillary costs such as shipping and taxes, but without discounts. | | ```javascript window._ti['currency'] ``` | Contains the currency in which the product is displayed. | | ```javascript window._ti['orderId'] ``` | Contains the purchase order number. Each order number must be unique. | | ```javascript window._ti["birthday"] ``` | Is filled in when the user specifies his birthday. The format is YYYYMMDD, for example 19810503. > In case of data protection concerns, the customer can only indicate the year via ""YYYY0101"", whereby month and year serve as placeholders, for example 19900101. | | ```javascript window._ti['gender'] ``` | Is filled in when the user specifies their gender. Possible values: - **1** = male - **2** = female | | ```javascript window._ti['couponValue'] ``` | Contains the actual value of a coupon if it was used. | --- ## Data Layer for Internal Searches The internal search is an essential navigation element widely used for web pages. It is also an excellent web analytical tool for obtaining information on website visitors to optimize, for example, the conversion rate. With the help of internal search analysis, you can better understand which keywords were used by visitors during a session, on which pages this search takes place and, which target pages visitors access later. There are two methods for tracking internal searches: ### Using URL parameters > [!WARNING] > If you are interested in using the URL parameter method, please contact your Account Manager. The Account Manager can then make the necessary changes in Mapp Q3 (configuration of query parameters). ### Using a Data Layer #### Example ```javascript window._ti['internalSearchPhrase'] = 'adidas shoes'; window._ti['internalSearchResultsQuantity'] = '15'; ``` | Data Layer Variable | Description | | --- | --- | | ```javascript window._ti['internalSearchPhrase'] ``` | Contains the search phrase as a string. | | ```javascript window._ti['internalSearchResultsQuantity'] ``` | Contains the quantity of the search results as a number. | > Please first check how your internal search is technically implemented and then select the appropriate variant. --- ## Implementing Tag Integration Loader The basis of the tracking implementation is the integration of the Tag Integration loader on your website. To do this, add the following configuration for Tag Integration below the data layer of your website: #### Example ```javascript window._tiConfig = window._tiConfig || {    tiDomain: 'responder.wt-safetag.com',    tiId: '111111111111111',    option: {} };   /** start TagIntegration loader  */ (function(a,d,c,f){a.wts=a.wts||[];var g=function(b){var a="";b.customDomain&&b.customPath?a=b.customDomain+"/"+b.customPath:b.tiDomain&&b.tiId&&(a=b.tiDomain+"/resp/api/get/"+b.tiId+"?url="+encodeURIComponent("https://"+d.location.host+"/")+"&v=5");if(b.option)for(var c in b.option)a+="&"+c+"="+encodeURIComponent(b.option[c]);return a};if(-1===d.cookie.indexOf("wt_r=1")){var e=d.getElementsByTagName(c)[0];c=d.createElement(c);c.async=!0;c.onload=function(){if("undefined"!==typeof a.wt_r&&!isNaN(a.wt_r)){var b= new Date,c=b.getTime()+1E3*parseInt(a.wt_r);b.setTime(c);d.cookie="wt_r=1;path=/;expires="+b.toUTCString()}};c.onerror=function(){"undefined"!==typeof a.wt_mcp_hide&&"function"===typeof a.wt_mcp_hide.show&&(a.wt_mcp_hide.show(),a.wt_mcp_hide.show=function(){})};c.src="//"+g(f);e.parentNode.insertBefore(c,e)}})(window,document,"script",_tiConfig);   /** end TagIntegration loader */ ``` | Parameter | Description | | --- | --- | | tiDomain | You can obtain this information from your Mapp Intelligence consultant. If you have further questions, please contact them directly. | | tiId | --- Warning: Please be cautious when updating your data layer. The data layer is the source of analytical information for Mapp Intelligence. Changes may accidentally remove our tracking pixel, causing disruption and data loss. Any inconsistency will immediately impact data tracking quality. This means data won’t be available in reports, dashboards, or Engage.