- TLC Home Home
- Forums Forums
- Product Guides Product Guides
- Developer Docs Developer Docs
- Product Ideas Product Ideas
- Education Education
- Blog TLC Blog
- Support Desk Support Desk
This article provides a feature overview and a description of the components required for a full implementation of hosted data layer.
In this article:
Hosted data layer facilitates the use of statically hosted data for the purpose of supplementing the dynamic on-page data layer of your website or for hosting JSON configuration files. Although the data layer implemented on your website is useful in capturing real-time information, it can be a challenge to build out your data layer to contain all the data with value to your organization. Hosted data layer provides a convenient mechanism to upload your static data to the Tealium mCDN, from where it can be accessed by your web pages to enrich the on-page data or power an application that uses JSON files.
Hosted data layer utilizes micro data layer objects that are associated to a variable in your on-page data layer. The hosted data layer object is a text file that contains a JSON object in which the key/value pairs represent the micro data layer. This file is uploaded to the CDN using the Hosted Data Layer API. The on-page data layer contains lookup variables, which are configured in the Hosted Data Layer extension in iQ, that are used to determine which hosted data layer object to fetch from the CDN.
The following sections provide a description of the two required components, the Hosted Data Layer API and the Hosted Data Layer extension.
These objects can also be plain JSON files used for purposes other than data layer augmentation and would not require the use of the Hosted Data Layer extension.
The hosted data layer API allows you to upload the supplemental data to the CDN in a flat JSON object called a hosted data layer object. The API enables the programmatic processing of large amounts of data to be used as hosted data layer objects.
The following example shows the contents of a hosted data layer object:
{ "product_category" : ["Accessories"], "product_brand" : ["Acme"], "product_sku" : ["GEN-PRD-BLU"], "product_has_free_shipping" : ["0"], "product_has_instore_pickup" : ["1"] }
As shown in the example, a hosted data layer object looks similar to the data layer object on your website. While the on-page data layer describes the page and customer interactions, the hosted data layer object provides additional attributes based on a specific variable on the page. Additional attributes for a specific product are provided in the example.
The API can be used to store other types of information in JSON format besides data layer values.
For detailed instructions, see How to use the Hosted Data Layer API.
The hosted data layer extension is the component that combines the hosted data with the in-page data, as follows:
For detailed instructions, see How to set up the Hosted Data Layer extension.
A lookup variable identifies which variable in the on-page data layer will be used to fetch the corresponding hosted data layer object for that page. The lookup variable is the shared link between the hosted data layer objects and the hosted data layer extension.
You must identify your lookup variables first and then use the expected values of each variable to name your hosted data layer objects. For example, if your lookup variable is item_id
and one of the values is 123
, the corresponding hosted data layer object will be named 123.js
.
The following list summarizes the order of operations for the hosted data layer extension:
utag.cfg.noview=true
.utag.view()
with that new object.Timing Issue
Due to the delay introduced by the hosted data layer extension, extensions scoped to "DOM Ready" might run before some "All Tags" extensions.
The following list and diagram summarizes how the hosted data layer extension processes data.
The following is a use case to illustrate how Hosted Data Layer can be used to add new data layer variables to the page.
The following steps describe the implementation process for this use case:
product_id
, which is also an identifier in the offline data and a good candidate for a lookup variable.product_id
.product_id=["PRD123"]
, then a matching Hosted Data Layer file named PRD123.js is created.product_id
.product_id
available, you have used the Hosted Data Layer API to upload additional product data. The lookup variable is now product_id
, which means that the values of the product identifier variable determines the names of the hosted data layer objects.
On-Page Data Layer
|
{ "page_type" : "product", "product_id" : ["PRD123"] |
Hosted Data Layer Object
|
{ "has_free_shipping" : ["0"], "has_instore_pickup" : ["1"] } |
Merged Data Layer (sent directly to utag.view()) |
utag.view({ "page_type" : "product", |
This section illustrates a use case that shows how hosted data layer can be used to serve a remote JSON configuration file for an implementation of AMP Analytics.
Learn more about implementing Tealium for AMP.
Use the following steps to serve a remote JSON file for an AMP Analytics configuration:
{ "requests": { "pageview": "https://example.com/analytics?url=${canonicalUrl}&title=${title}&acct=${account}" }, "vars": { "account": "A0123456789" }, "triggers": { "trackPageview": { "on": "visible", "request": "pageview" },
"links": {
"on": "click",
"selector": ".tracked-links-selector",
"request": "event"
} } }
https://tags.tiqcdn.com/dle/ACCOUNT/PROFILE/amp.analytics.config.json
amp-analytics
tag:<amp-analytics config="https://tags.tiqcdn.com/dle/ACCOUNT/PROFILE/amp.analytics.config.json">
Copyright All Rights Reserved © 2008-2019