Tealium Generic Tag Setup Guide

Tealium Generic Tag Setup Guide

by jared_hislop on ‎03-02-2016 01:27 PM - edited on ‎02-07-2018 11:03 AM by Community Manager (3,961 Views)

This article shows up to set up and configure the Tealium Generic Tag, a one-size-fits-most generic tag container used for implementing almost any image, iframe, or script-style pixel to your pages.

The following topics are covered:

Table of Contents Placeholder

Identifying the Tag Type

This tag supports one of three types: image, iframe, or script.  Identifying the type of tag you are working with is important, so here are some clues to look for when setting up your tag. If the code for your tag matches any of these patterns, then choose the corresponding tag in the configuration.

Image

Image tag code snippets usually contain one of the following:

  •  new Image()
  •  <img src="https://
  •  document.write("<img src=" ... ">");

Iframe

Iframe tag code snippets usually contain one of the following:

  •  document.createElement('iframe')
  •  <iframe src="https://
  •  document.write("<iframe src=" ... "></iframe");

Script

Script tag code snippets usually contain one of the following:

  •  <script type="text/javascript" src="//example.com/tag.js"></script>
  •  document.createElement('script')

Understanding Tag Components

To configure the Generic Tag you will need to understand the following components that make up your tag.

Base URL

The base URL is the hostname, pathname, and file pointing to the location of the pixel. It does not include the "?" character or the query string parameters.

In our sample pixel above, the base url is: //www.example.com/tag.gif 

Static and Dynamic Parameters

Many tags collect data by using the query string of the URL. These are the key/value pairs that appear in the URL after the "?" character. In our example the parameters are:

cid=112233&rg=us&rnd=' + rnd_nocache + '&ref=' + referrer

Static parameters have values that you can see in the snippet and do not change from page to page. In this example, the static parameters are:

  •  cid=112233
  •  rg=us

Dynamic parameters can be set on the fly and their values can change from page to page. In this example, the dynamic parameters are:

  • rnd
  • ref

The dynamic parameters must be configured using Data Mappings. All variables configured as mappings will be appended to the query string parameter of the tag URL as key/value pairs.

Cache Bust

It's common for vendor tags to require a cache bust variable in the query string. This is a randomly generated value added to URLs to prevent the browser from caching the request. Our example includes a cache busting variable called rnd.

This functionality is built into the Generic Tag. Simply enable the cache bust setting and specify the name of the cache bust parameter.

Tag Configuration

First, go to the Tag Marketplace and add the Generic Tag to your profile (how to add a Tag?).

tealium-generic-tag-configuration.png

After adding the Tag, configure the below settings:

  1. Title (required): The default is "Tealium Generic Tag". You may replace it with a custom name of choice.
  2. Type (required): Select the type of pixel that was given to you for implementation.
  3. HTTP URL (required): Enter the base url (excluding the protocol)
  4. HTTPS URL: Use this field if the HTTPS url is different from the Base URL.
    • If the Base and HTTPS URL is same, then add "//" as the prefix in the Base URL field and leave the HTTPS URL field empty. This tells the Tealium Generic Tag to apply HTTP and HTTPS appropriately based on the current location protocol.
    • If the URLs are different, add them in the respective fields.
  5. Query String Delimiter: The delimiter char that separates the query string portion from the URL. The default is "?". You may change this to a custom delimiter of choice.
  6. Parameter Delimiter: The delimiter char that separates all the key-value pairs in the query string. The default is "&". You may change this to a custom delimiter of choice.
  7. Key/Value Delimiter: The delimiter char that separates a key and its value. The default is "=". You may change this to a a custom delimiter of choice.
  8. Query String: Enter the query string parameters; separate each name-value pair with the parameter delimiter you are using.

Dynamic Value Substitution

This tag supports dynamic value substitution, which allows you to reference data layer variables directly in the HTTP URL or Query String configuration fields. This provides the flexibility to create a dynamic tag based on your data layer. To use a data layer variable in a field, refernce the variable name by surrounding it with "@@". For example, to insert a data layer variable named "account_id" into the path of the URL, enter a value like this: //example.com/path/@@account_id@@/i.gif

Each type of data layer variable can be substituted using the following prefixes:

  • Javascript Page Variable - @@js_page.variable@@
  • Meta Tag - @@meta.variable@@
  • Querystring Parameter - @@qp.variable@@
  • Cookie Value - @@cp.variable@@

Load Rules

Load Rules determine when and where to load an instance of this Tag on your site.

Data Mappings

Mapping is the process of sending data from a Data Layer Variable to the corresponding destination variable of the vendor Tag. For instructions on how to map a Variable to a Tag destination, see Data Mappings.

 

The Generic Tag supports custom mappings only. You can define a custom destination name in the text field.

Triggering a Callback Function

If your tag requires code to run after the main library has loaded you can use the callback function.The Generic Tag defines an internal callback property named u.callback that you can redefine within a tag-scoped Javascript Code extension.  Simply create a new extension, add your callback code, and scope it to the Generic Tag. This code will then run after the tag code has executed on the page.

Example:

// Put this code in a Javascript Code extension scoped to the tag.
u.callback = function() {
console.log("The tag has loaded, now do cool stuff!");
}

 generic-tag-callback-extension.jpg