Overview

I have set up https://dv.affiliation.services/ - a simple WordPress website using Mercury Theme (themeforest). This demo also features the slot demos that are hosted by Slots Launch.  

Technologies:

• WordPress (CMS)
• CloudFlare
• Pretty Links Pro (Plugin)
• Google Tag Manager

Setting up Tag Manager / Data Layer

Install the GTM Snippet in the header/body of the website as instructed by Tag Manager. In WordPress I have used the Code Snippets plugin but this can be done in a number of different ways.

Set up Data Layer Variables

User Defined variables are set with Javascript 

CleanPageSlug

CleanPageSlug is a variable to get the current URL Path as a variable

DeviceType

DeviceType returns Mobile, Tablet or Desktop devices

(See User GEO section for accessing CF-IPCountry Header from CloudFlare)

This is a Data Layer Variable with the variable name geoCountry

UniqueClickID

UniqueClickID generates a random string of numbers to identify a user uniquely.

It’s important to scope this to a session rather than a single click to identify if users have clicked on multiple offers. 

In this use case, the clickID is the timestamp the user accessed the site followed by 8 random digits. 

NOTE: Not all platforms will be able to receive the click ID in this format - it is for testing only until the uniform standard is confirmed by the programs/softwares.

Accessing the Data Layer Variables

In Tag manager I have a tag set to console.log the variables when the page loads for troubleshooting to ensure that they are accessible:

This is a Custom HTML tag that triggers on DOM Ready to simply log the variables to the console.

User GEO

Since the site has been routed through CloudFlare (Free version) you are able to go to CloudFlare > Network and enable IP Geolocation

This allows for CF-IPCountry header to be accessed on the site.

Then in the function.php you can add a snippet to access the CF-IPCountry header and push it into the GTM Data Layer:

And it shows the following:

Updating the Data Layer Variables

We want some of these variables to be updated (such as the page slug) when the user navigates around the site, so I have also set up another tag canned Push DV to DataLayer which is a Custom HTML tag firing on All Pages:

This pushes the updated variables to the data layer every time the page updates, and if the data is new (like page slug) it will overwrite the existing values.

NOTE: Most values here e.g. click ID, geo and device type will not change between pages - but they are pushed to the data layer when the user first views the page.

Accessing the Data Layer Variables

Putting the data layer name into the console allows you to access the data layer objects:

In this case the example data is myGtmData

You can also access the object directly:

User GEO

Since the site has been routed through CloudFlare (Free version) you are able to go to CloudFlare > Network and enable IP Geolocation

This allows for CF-IPCountry header to be accessed on the site.

Then in the function.php you can add a snippet to access the CF-IPCountry header and push it into the GTM Data Layer:

Ensure that the name highlighted matches the variable name set in GTM Variables.

Link Management

To manage the links I am using Pretty Links Pro. The pro version allows for javascript redirects vs the standard (free) server-side redirects. This allows us to inject the variables into the target URL before the redirection happens.

The redirection type is set to Javascript and the target URL is provided by the affiliate program.

Since this example uses cellxpert software, I have also appended the dynamic variables that cellxpert software expects:

• AFP
• AFP1
• AFP2
• AFP3

And added these as query parameters to the end of the tracking link provided - i have also added the placeholders DV1, DV2, DV3, DV4 where I want to replace them with the dataLayer variables.

The pretty link is the shortened/masked version that the user will put on their site. 

Link Redirection

When the user clicks on the masked link on the site - they go through a javascript redirect with the following chain as an example:

The first step here

Status CodeURLIPPage TypeRedirect TypeRedirect URL
200 https://dv.affiliation.services/goto/heyspincasino188.114.96.7client_redirectjavascript

https://www.ontrklnk.com/visit/?bta=35251&nci=5723&afp=DV1&afp1=DV2&afp2=DV3&afp3=DV4

Is a 200 then javascript redirect