How can we help?

Add Cordial JavaScript Listener v2 to Tealium iQ


This article describes how to install Cordial's Javascript Listener v2 via Tealium iQ using the Tealium Custom Container tag. Before you get started, it's important to understand what customer events and data you need to fuel your campaign. Once you've established that, follow the steps below to add our Javascript Listener to your site.

Add tag

1. Open Tealium iQ.

2. Click on Tags and select Add Tag.

3. Find the Tealium Custom Container and select Add.

4. Enter the title as Cordial.

5. Set Publish to Dev and/or Publish to QA to Yes, but set Publish to Prod to No. (This is to prevent pushing to production while you get everything set up.)

You'll need to go back and change Publish to Prod to Yes when you're ready to push this live to the production site (after testing).

6. Select Finish.

Configure tag

1. Once the publish is complete, find the tag and click Edit under Tag Configuration.

2. Open Advanced Settings.

3. Scroll to the bottom and click Edit Templates.

4. Replace the entire content with the content of the CordialCustomContainerV2 file:

5. Click Apply and close the window.

Configure data mapping

1. Click Data Mappings and open the Variables dropdown.

2. Click Add Variable, type in account_key, then select Apply.

3. Click Select Destination, type in account_key, and click +Add then Done.

4. Use the same process to add trackUrl, connectUrl, and cookieDomain. When finished, click Apply.

Configure extensions

1. Select Extensions.

2. Add Extension then click + Add under Set Data Values.

3. Set the title.

4. Uncheck Prod so it won't publish to production while you set up.

This first extension is for your sandbox, for which you'll use the same setup as production, except for the account_key.

5. Set the Scope to Tag Scoped Extensions.

7. Map values to account_key, trackUrl, connectUrl, and cookieDomain.

8. Add a Condition to only fire when the environment is dev or QA.

9. Duplicate this extension.

10. Check Prod and uncheck Dev, then update the mappings with your production values.

11. Update the condition to Prod.

Map events

To fire the appropriate events in Cordial, you need to populate a string and map it to event for the tag. Most pages should use browse as the event.

The event name can be customized for your needs. For example, you might have browse_category or browse_product so you you can distinguish different events that might trigger other actions.


If the user logged in or provided their email for a newsletter or checkout, you'll also want to fire contact,browse.


For purchases, fire order.


Set cartitem to fire when someone views the basket or cart page.


For a cart removal or reduction in quantity, fire cart_remove.


For a cart add, fire cart_add.

Save and publish

Finally, Save and Publish your tag to Dev and/or QA. You will be able to begin testing.



Please sign in to leave a comment.