Create Third Party Tags with dynamic data

First things first; In order to download tags with dynamic data, you first need to add your creatives to a campaign. Create a new campaign via the blue +New button in the top right corner, the navigate to the campaign page on the top left to view your newly created campaign.

after all your creatives are in order and ready to download as Third Party Tags, select the creatives you are ready to download and click "download tags" at the bottom of the page.

A popup will show giving you options on what sort of tags you want. This documentation will only focus on the "Dynamic Data" part of this popup. By default this part of the popup is collapsed. You can start creating dynamic data by opening it up and clicking "add row" on the bottom right

These two new cells that are added for each rows correspond the key value as if you were to add them via the URL. Lets use the same json object we use before. if we wanted to access the item where the Unique_id is Banner_1, as in our example earlier, we would fill it in like this

Once you're done and everything you need is filled out, download the tag via download button.

lets take a look at a mockup of a Xandr tag and see how the dynamic part is added.

<script type='text/javascript' id='pexi-tag'>var pexiAd =
{'id':,'width':,'height':,'cacheBust':'${CACHEBUSTER}','clickTracker':
['${CLICK_URL}'],'dynamic':{'Unique_id':'Banner_1'},'mediaURL':''}; 
document.write('<scrip'+'t src="https://static.pexi.nl/3.3/default.js">
</scrip'+'t>');</script>

to see if the dynamic part was added correctly, look for the dynamic key in the tag. in our case we can see 'dynamic':{'Unique_id':'Banner_1'} is added to the tag.

Technical explanation

To start using dynamic data, let's first explain how dynamic data is read. Dynamic data is ready in two ways; the first way is that it is passed to the creative as parameters in the url. the second way is as a parameter in the tag. Both options use the exact same code, but we will explore both options in this documentation. the first things we need is a way to read the passed parameters to the creative, we have a function for that!

GET()['your parameter'];

This GET function reads the parameter passed through the url. The parameters are always written as a the name(key) and the value associated with that key. for example if you add ?param1=foo&param2=bar to your local banner file URL the value of param1 is foo, and the value of param2 is bar. you can access those parameters as such

// localhost/banner?param1=foo&param2=bar

let param1 = GET()['param1'];
let param2 = GET()['param2];

console.log(param1, param2);
// will output foo and bar

With this function we can add or change anything we want based on the passed parameters. Lets take for example you have a json object with the following structure

let jsonObject = 
[
  {
    "Unique_id":"Banner_1",
    "copy":"Lorem Ipsum"
  }, {
    "Unique_id":"Banner_2",
    "copy":"dolor sit amet"
  }, {
    "Unique_id":"Banner_3",
    "copy":"consectetur adipiscing"
  },
]

We want to change the content of our creative based on the unique id passed from the url to the creative. We can do that using the previously mentioned Get function.

// localhost/banner?Unique_id=Banner_1

let Passed_Unique_id = GET()['Unique_id'];

console.log(Passed_Unique_id);
// will output 'Banner_1'

// we will now filter the json object based on the unique Id we got from the url

let filteredObject = jsonObject.filter((item)=>{
  return item.Unique_id == Passed_Unique_id
})[0];

console.log(filteredObject.copy)
// will output 'Lorem Ipsum'

We have now filtered the previously mentioned json object and gotten back the item that corresponded with the unique Id we defined beforehand. with this new filteredObject you can then make changes to the creative.

in the same way GET()['your parameter']; looks for parameters in the url, the function also looks for that same key in the tag. In the aforementioned tag it will read Unique_id as Banner_1 just like in our example