Utilizing a Prerender Hook

Using the prerender hook functionality of ArcAds allows you to gather information about an advertisement before it renders. The primary use for this functionality is to integrate third party vendors into ArcAds which are not natively supported.

Registering the Advertisement

When calling the registerAd method you can pass in a parameter called prerender with a function as its value.

arcAds.registerAd({
  id: 'div-id-123',
  slotName: 'hp/hp-1',
  dimensions: '[[300, 250], [300, 600]]',
  display: 'desktop',
  prerender: adFunction
})

Inside your function you must return a promise otherwise ArcAds will ignore it. If the promise you return isn't resolved the advertisement flow will be indefinitely paused and your advertisement will not display.

adFunction = function(ad) {
  return new Promise(function(resolve, reject) {
    // The 'ad' arguement will provide information about the unit
    console.log(ad)
    // If you do not resolve the promise the advertisement will not display
    resolve()
  });
}

You can gather information about the advertisement by accessing the ad argument/object. This function will also be called when a sizemapped advertisement is about to refresh at a breakpoint, providing information about the size of the creative that is about to serve.

Key	Description
adUnit	An object containing the GPT ad slot. This can be used when calling other GPT methods.
adSlot	Contains a string with the full slot name of the advertisement.
adDimensions	Contains an array with the size of the advertisement which is about to load.
adId	Contains a string with the id of the advertisement.

Using the Data

If you'd like to integrate with an unsupported header bidding service or something similar you can use the prerender hook to attach targeting data to an advertisement before it renders. In the following example we check to see if Krux is available, and use the returned data from ad to attach the targeting data it requires.

adFunction = function(ad) {
  return new Promise(function(resolve, reject) {
    // Run all of the logic to get the targeting parameters here
    if (window.Krux) {
     // Uses the returned adUnit data to run the GPT setTargeting method
     ad.adUnit.setTargeting('ksg', window.Krux.segments)
    }
    // Resolve the promise to make the ad render
    resolve()
  });
}