DoubleClick Floodlight Tags and Google Tag Manager – Lean up Your Containers

Managing frequently changing Floodlight activity tags in Google Tag Manager? There is another way – a cooler way.

Anybody who uses DoubleClick Floodlight knows the slow process of implementing a new tag for each activity for a campaign interaction or conversion. If you’re using Google Tag Manager to add a tag, trigger and maybe some new variables for every new Floodlight – it won’t take long for your container to overfill with almost identical tags. While there’s nothing wrong with this style of implementation, there is another way.

Caveats

If you’re not familiar with using GTM Lookup Tables, there are a ton of great resources out there to help you get the gist before you go any further. We’re going to be using Lookup Table chaining in this article, something Simo Ahava has covered to automate and de-duplicate similar tag functionality. Simo’s post is a recommended read if you’re unsure about chaining lookup tables together. If you’ve ever used VLOOKUP in Excel, this is essentially the same process but displayed differently.

Test everything. This process can become confusing pretty quickly. Grab a piece of paper and draw out how you want your Floodlight tags to work before implementing them. If you do it wrong, you could be firing Floodlight tags for the wrong events.

Reduce Duplication

Keeping GTM containers in lean shape is good practice.  Here’s an example of how it can quickly become very samey when dealing with Floodlight tags:

Our objective is to turn the above into this:

Here’s a diagram/flowchart of what we’re going to achieve today. (Top left is your new universal Floodlight tag. Go anti-clockwise)

The Objective

Let’s say we have 10 Floodlight Counters. They need to be implemented into 10 different pages. Doing it the standard way would require 10 tags and 10 page triggers. Our way will only require 1 tag and 1 trigger. If you’re following along with your own GTM account, we advise setting up a new container to avoid disturbing active functionality. Here’s what we’re going to create.

Tags

• Floodlight – Dynamic Tag Injector

Triggers

• All Events

Variables

• • JS – Floodlight – Activity ID
  • JS – Floodlight – Advertiser ID
  • JS – Floodlight – Group ID
  • RegEx Lookup Table – Floodlight Data
  • RegEx Lookup Table – Floodlight – Page Views

Let’s work from the ground up with this implementation. We’ll start by building the required variables, then the trigger and finally, the tag.

Create the Variables

Enable built-in variables

For the this implementation, we’ll be using the following built-in variables:

RegEx Lookup Table – Key Page Views

For this part of the task, you can either make up some example pages to test this functionality, or perhaps gather a list of active Floodlight Counters and their respective pages you’d like them to appear on.

Each Floodlight Counter requires at least three pieces of information:

• Advertiser ID
• Activity ID
• Group ID

Typically, you would add a snippet of JavaScript code to the page for the required counter which would trigger on page load. For Google Tag Manager, you are only required to enter the above sections of information. GTM then creates the snippet for you in the background. We will get onto that section later.

Below is our RegEx Lookup for key page views. The idea here is to match up a specific URL to a specific set of Floodlight variables. We do this by taking the three variables and adding a double pipe between each one like so: advertiserID||groupID||activityID

We can then take these key pairs and add them like the example below.

Lookup Table – Floodlight Data

So, we’ve created a list of key pages and their corresponding Floodlight tags as a variable. Now we need to create our top-level Lookup Table. This table is the heart of the setup. Its’ role is to cycle through each sub lookup table until a positive result is returned.

Currently, we only have 1 entry within this table. This is because, for now, we are only going to track page views. To track page views, we can call on the gtm.js event. This event will fire on every pageview where Google Tag Manager is installed. If you use a debugging tool to track events, you may see it displayed like this in console:

Floodlight Variables

Earlier, we created a string of values separated by double pipe characters. To be able to use these values after the correct set has been chosen, we need to decompress them.

The following three variables are all Custom Javascript Scripts and pull apart the value string.

JS Floodlight – Advertiser ID

function() {
    var floodlightData = {{Lookup - Floodlight Data}};

    if (!floodlightData)
    return;

    return floodlightData.split("||")[0];
}

JS Floodlight – Group ID

function() {
    var floodlightData = {{Regex Lookup - Floodlight Data}};

    if (!floodlightData)
    return;

    return floodlightData.split("||")[1];
}

JS Floodlight – Activity ID

function() {
    var floodlightData = {{Regex Lookup - Floodlight Data}};

    if (!floodlightData)
    return;

    return floodlightData.split("||")[2];
}

Create the Trigger

Floodlight – Rule Detection

For the trigger, we are setting up a simple global event trigger to activate when any event fires AND the top-level Lookup table has a positive result.

Create the Tag

Floodlight – Dynamic Tag Injector

Now the variables and triggers are in place, we can piece together the Floodlight Counter Tag using the custom data we’ve added.

And that’s it! Now we have everything in place – let’s give it a test run. We know that there is a Floodlight Counter set up for a few URLs on our website so let’s try it out. Our Pageview Regex Lookup contains the following 3 matches:

You’ll also notice the addition of some Regex at the end of each match to allow for optional query parameters. In GTM Preview Mode, we can see that the Floodlight Counter Tag fires on Page View with all the details from the child lookup table in place:

Here’s a quick runthrough of what has happened in this scenario:

1. Floodlight Event Lookup Table
2. Page Views Match Found
3. Floodlight values assigned
4. Floodlight Tag Fires

Going Further

Page View matching is a great starting point. But there are lots of extra events that could be added:

• File Downloads
• Form Submissions
• Specific Link Clicks
• Specific Page Match
• Specific Download Event Match *
• Scroll Depth
• Video Play Time (50% complete etc)

* Here, we’d look at first matching to a pageview table, and then matching to a secondary table for a specific download event. This is classed as a multi-chain lookup and requires more technical knowledge to implement.

Download Container

We’ve created a slightly more advanced container with some extra nuggets of gold. Download Link Here

Author Jake Kimpton

Posted December 5, 2019