iQ Tag Management

Merging Another JavaScript Object with the Universal Data Object

Why would I want to do this?

As a best practice, Tealium recommends that you develop a robust Universal Data Object (UDO) to encompass all of your data points. However, we recognize that sometimes it is easier for you to maintain and leverage an existing data object in conjunction with the UDO.

Referencing variables is easier

Referencing a UDO variable with the JavaScript Code Extension is syntactically simpler that referencing a variable outside the UDO.

It may be faster

To abide by Tealium's best practice of using a single UDO you would have to transfer all of the variables in your current data object to the Tealium UDO. This can take some time, depending on your development cycle. This solution may be faster.

Using the utag.link() and utag.view() functions

If you plan to use the utag.link() and utag.view() functions directly, as a best practice we recommend referencing the UDO rather than another data object.

NOTE: Your page's source code will not change as a result of merging the data objects as described below. The data object will appear merged in the DOM instead.

Example: Merging Your s. Object with the Tealium UDO

So, let's say that you or your client is a current SiteCatalyst user, but will be switching over to Tealium in the near future. And let's say that you or your client does not want to (or cannot) remove the "s." objects from the page, but instead would like to continue updating the "s." object variables as you have in the past. There is a solution that will allow you to keep the "s." object on the page, allow you to update it, and still allow you use those variables in conjunction with the "utag_data" object that you will use for your other Tealium-managed Tags.

In order to maintain your "s." object and merge the "s." object and the utag_data object, you will need to follow three steps:

Step 1: Declaring the s. Object

Declare the "s" object so that your page doesn't throw an error when it comes across the "s." variables. You can add this declaration to the page code itself, or place the declaration in the "utag.sync.js"/"utag.footer.js" file and then place the file somewhere before the first "s." variable is defined. The declaration for the s object is simply:

var s = s || {};

Using the utag.footer.js file

Make certain you enable the 'This profile uses a utag.footer.js file' Publish Setting. Even if you've added the utag.fooler.js file to your page's code, if you don't have this Publish Setting enabled, it won't work.
Insert the declare statement into the utag.footer.js file's template. To do this:
1. In Tealium iQ, click on your email address in the upper right corner.
2. The Admin Menu will appear. Click on Manage Templates.
3. The Template Config window will appear. Select 'uTag Footer (Profile) UID:footer' from the drop-down list.
4. Insert the declare statement into the template's code.
5. Click 'Save Profile Template' and exit the Template Config window.
6. Save/Publish the profile.
Include the utag.footer.js file reference on your page. We recommend placing this somewhere between the opening and closing <head> tags, so that the "s." object is declared as soon as possible.

Step 2: Use the JavaScript Code Extension to merge the Objects

Add a JavaScript Code Extension in Tealium iQ that contains the code needed to merge the two objects.

Navigate to the Extensions tab and add the JavaScript Code Extension, located under the Advanced tab of the Extensions marketplace.
Enter a descriptive title for this Extension.
Set the scope to 'Pre Loader'. This Extension needs to run the merge code before Tealium processes the Universal Data Object.

Step 3: Adding the merge code to the JavaScript Code Extension

Add the merge code into the Pre-Loader extension you just created. The code you use depends on whether or not your site uses jQuery.

jQuery Merge Code

For sites with jQuery, insert the following code:

if (typeof s == "object" && typeof utag_data == "object"){
  utag_data = jQuery.extend({}, utag_data, s)}

Which will look like this in Tealium iQ:

You can read more about this jQuery method here.

Note: This code has been tested and works on all previous jQuery versions back to 1.0.

JavaScript Merge Code

For sites without jQuery, there is a JavaScript alternative:

if (typeof s == "object" && typeof utag_data == "object"){
  for (key in s) {
   utag_data[key] = s[key];
  }
};