Overview

A Container Tag is a single piece of JavaScript code that is implemented on a merchant's web site. Container tags make it easier for merchants to add, change, or remove marketing tags, because they provide a delivery mechanism for the tags they contain. The changes are done in one single place within the Container Tag interface, instead of writing code for tags page by page on the web site.

So what are TAGs?

Tags are critical to online marketing as they are essentially the means by which data is collected on a website.
A tag may be a simple 1x1 transparent pixel or image tag loaded onto the web page.
A tag could also take the form of JavaScript code that allows for more advanced data collection as in the case of Container Tags.
Tags are incorporated into the HTML/JavaScript code delivered by a web browser or app when a web page loads.
Tags have different functions, for example:
- Instruct web browsers to collect data
- Set cookies on the visitor's web page
- Integrate third-party content into a website (e.g. social media widgets, video players, ads, etc.)

Merchant benefits

Saving technical resources – you just need to implement CT once.
Fast implementation – adding CT is a quick process and allows you to work with different online partners
Flexibility in choosing which affiliates you partner with – you can implement inside of CT as many partners as you wish to work with.
Simplicity in implementation of additional tags – you can add analytics tools or Facebook’s “Like button”
Saving time – you add new tags or scripts inside of CT and not on your website

What is retargeting and why to use it?

Retargeting affiliates are companies working with merchants through the affiliate network as a retargeting service provider. Retargeting companies are running display ad campaigns targeted at visitors who have recently visited a merchant's site. Some of these companies have their own ad-networks, while others buy traffic from ad-networks, portals and ad-exchanges

Extensive reach: major portals and ad-networks are accessible by using retargeting providers.
Return conversion rates are increased because of higher click-through rates.
Build brand awareness and loyalty.
Tailor your message based on visitor's interest.
Show relevant offers to consumers.
Increase sales & leads generation.

Implementation

One Container Tag will be deployed across the entire site. For each stage of the user journey different scripts will be used to pass the relevant data. This data will be fed into a JavaScript array called TDConf.

Please note that if you have multiple programs for different brands and/or regions then additional Container Tags will be provided for those.

The scripts will need to be altered to identify and pass data from the following set of pages:

Homepage script - implement on non-product related pages
Product Listings script - implement on category sites or search results pages
Product Pages script - implement on product detail pages
Basket Page script - implement in the shopping cart
Login page script - implement on the login page
Confirmation Page script - implement on the merchant's confirmation page

Tips!

All parameters with [] should be filled in (e.g. [currency] will be EUR).
ContainerTagId is the id found in TradeDoubler's system or ask your contact at TradeDoubler. For every of the 5 cases described above there is a unique id.
Other parameters have to be filled in by the customer implementation.
All parameters in TDConf.Config should be strings with quotes(").
Variables are case sensitive.
All variables should be placed under the TDConf namespace to prevent errors in conflicts.
Decimal separators should be dots.
For currencies please use ISO 4217 standard (http://en.wikipedia.org/wiki/ISO_4217).
Please ensure that all product ids are the same you provide us within your product feeds.
URLs have to have a valid syntax. Please see http://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax

TradeDoubler suggests using asynchronous script version to avoid long loading time of your website. This version requires also less hardware and set-up process is quicker as synchronous. It’s also compatible with GTM (Google Tag Manager).

Step by step

Home page

Tag to be inserted on homepage and other non-product pages(case 1)
=======================================================================

<script type="text/javascript">

//Home 

 var TDConf = TDConf || {}; 

 TDConf.Config = { 

	 // Do not change 
	 containerTagType : "Home", 
	containerTagId :XXXX, 
 }; 

// Do not change except for the team Tradedoubler 

 (function(){ 
	 var TDcontainerTagId =XXXX;
	 var TDhost = "https://swrap.tradedoubler.com/wrap"; 
	 var TDAsync = document.createElement('script'); 
	 TDAsync.src = TDhost + "?id="+ TDcontainerTagId; 
	 TDAsync.async = "yes"; 
	 document.body.appendChild(TDAsync); 
 })(); 
</script>

XXXX – will be replaced by ID provided by TradeDoubler

Product listing pages

Tag to be inserted on product listing pages (case 2)
====================================================

//List Product 

 var TDConf = TDConf || {}; 

 TDConf.Config =  { 
 products:[ 
	 {id: "[product-id1]", price:"[price1]", currency:"[currency1]", name:"[product-name1]"},  
	 {id: "[product-id2]", price:"[price2]", 
	 currency:"[currency2]", name:"[product-name2]"},  
	 /*...*/ 
 ],  
 Category_name : "[Name of category products]",  

 // Do not change 
   containerTagType : "List_Product", 
   containerTagId: XXXX, 
 };// Do not change except for the team Tradedoubler 
 (function(){ 
	 var TDcontainerTagId=XXXX;
	 var TDhost = "https://swrap.tradedoubler.com/wrap"; 
	 var TDAsync = document.createElement('script'); 
	 TDAsync.src = TDhost + "?id="+ TDcontainerTagId; 
	 TDAsync.async = "yes"; 
	 document.body.appendChild(TDAsync); 
 })();  

</script>

The Product Listing Page script should trigger when a range of products is visible to the user. All placeholder values (those with square brackets) should be amended so that the relevant data is mapped.

It’s important to fill the value this way:

{id: "PRODUCTID1", price:"20.05", currency:"EUR", name:"PRODUCTNAME1"},

Product pages

The product details script pulls all information about the specific product the user is viewing. All placeholder values (those with square brackets) should be amended so that the relevant data is mapped.

Tag to be inserted on product pages (case 3)
============================================

<script type="text/javascript">

// Product 
 var TDConf = TDConf || {}; 
 TDConf.Config = { 
	 productId: "[product-id]", 
	 category: "[main-category-name]", 
	 brand: "[brand]",  
	 productName: "[product-name]",  
	 productDescription: "[product-description]", 
	 price: "[price]", 
	 currency: "[currency]", 
	 url: "[click-url]",  
	 imageUrl: "[url-to-product-image]", 

	 // Do not change 
	 containerTagType : "Product", 
	 containerTagId :XXXX, 
 };

 // Do not change except for the team Tradedoubler 
 (function(){ 
	 var TDcontainerTagId =XXXX; 
	 var TDhost = "https://swrap.tradedoubler.com/wrap"; 
	 var TDAsync = document.createElement('script'); 
	 TDAsync.src = TDhost + "?id="+ TDcontainerTagId; 
	 TDAsync.async = "yes"; 
	 document.body.appendChild(TDAsync); 
 })();  



</script>

Basket pages

The basket page script will collect all the product data that was added to the basket. All placeholder values (those with square brackets) should be amended so that the relevant data is mapped.

Tag to be inserted on basket pages (case 4)
===========================================



<script type="text/javascript">

 // Basket 
 var TDConf = TDConf || {}; 
 TDConf.Config = { 
	  products:[ 
	  {id: "[product-id1]", price:"[price1]", currency:"[currency1]", name:"[product-name1]", qty:"[quantity1]"},  
	   {id: "[product-id2]", price:"[price2]", currency:"[currency2]", name:"[product-name1]", qty:"[quantity2]"},  
	   /*...*/ 
	 ],   
	 // Do not change 
	 containerTagType : "Basket", 
	 containerTagId :XXXX, 
 };

 // Do not change except for the team Tradedoubler 
 (function(){ 
	 var TDcontainerTagId =XXXX; 
	 var TDhost = "https://swrap.tradedoubler.com/wrap"; 
	 var TDAsync = document.createElement('script'); 
	 TDAsync.src = TDhost + "?id="+ TDcontainerTagId; 
	 TDAsync.async = "yes"; 
	 document.body.appendChild(TDAsync); 
 })();  


</script>

Login page

This script identifies when the user logins to their account (or sign up to one). Tradedoubler does not collect any personal data from this page, it will only be used for user journey purposes. ”

Tag to be inserted on login pages (case 5)
=======================================================================

<script type="text/javascript">

//Login 

 var TDConf = TDConf || {}; 

 TDConf.Config = { 

	 // Do not change 
	 containerTagType : "Login", 
	containerTagId :XXXX, 
 }; 

// Do not change except for the team Tradedoubler 

 (function(){ 
	 var TDcontainerTagId =XXXX;
	 var TDhost = "https://swrap.tradedoubler.com/wrap"; 
	 var TDAsync = document.createElement('script'); 
	 TDAsync.src = TDhost + "?id="+ TDcontainerTagId; 
	 TDAsync.async = "yes"; 
	 document.body.appendChild(TDAsync); 
 })(); 

</script>

Confirmation page

The confirmation page script collects data about the purchased products and is vital as it enables conversion measurement for our partners. All placeholder values (those with square brackets) should be amended so that the relevant data is mapped..

Tag to be inserted on post-purchase page (case 6)
=================================================
<script type="text/javascript">


 // Confirmation 
 var TDConf = TDConf || {}; 
 TDConf.Config = { 
   products:[ 
     {id: "[product-id1]", price:"[price1]", currency:"[currency1]", name:"[product-name1]",grpId:"[group-product-id1]", qty:"[quantity1]"},  
     {id: "[product-id2]", price:"[price2]", currency:"[currency2]", name:"[product-name1]",grpId:"[group-product-id2]", qty:"[quantity2]"},  
     /*...*/ 
   ], 
 orderId: "[orderId]",  
 orderValue: "[orderValue]", 
 currency: "[currency]", 
    // Do not change 
    containerTagType : "Purchase", 
    containerTagId :XXXX, 
 };

 // Do not change except for the team Tradedoubler 
 (function(){ 
	 var TDcontainerTagId =XXXX; 
	 var TDhost = "https://swrap.tradedoubler.com/wrap"; 
	 var TDAsync = document.createElement('script'); 
	 TDAsync.src = TDhost + "?id="+ TDcontainerTagId; 
	 TDAsync.async = "yes"; 
	 document.body.appendChild(TDAsync); 
 })();  
 

</script>