🛠️Customization

This section details how to customize the Header Bidding wrapper using custom scripts and modules.

Overview

• Write modular scripts using the custom_[name].js convention

• Use the wrapper macro $$PREBID_GLOBAL$$ in code examples; in production use your assigned global

• Prefer queueing code that interacts with the wrapper API

Custom Script Files

Custom script/modules files can be loaded and concatenated to the core code. For the file to be parsed it needs to have the name with following syntax: custom_[filename].js

e.g.: custom_interstitial.js

It will always start with custom_ and the code needs to be written in javascript.

Any valid javascript is allowed.

Can import any module.

Can use the macro $$PREBID_GLOBAL$$.

Executing Code After Page Load

The window.docReady function can be used to execute code after the page has been fully loaded. This is useful for ensuring that the DOM is ready before your custom code runs.

Including Source Files

You can import modules from the src directory into your custom scripts. However, because of the build process, the relative path to these files will be one level deeper than it appears in the source tree. For example, to import utils.js from the src folder, you would use ../utils.js.

Example

Here is an example of a custom script that uses both window.docReady and an import from the src directory:

import { logMessage, logError } from '../utils.js';

window.docReady(function() {
    // Your code here
    logMessage("Document is ready, custom script is executing.");
});

Categories

Layout & Rich Media

• Manipulate DOM around ad units

• Use RichMedia Manager to register formats

Loading & Auctions

• Use $$PREBID_GLOBAL$$.processAdsOnPage() for dynamically injected units

• Queue interactions:

($$PREBID_GLOBAL$$ = $$PREBID_GLOBAL$$ || { cmd: [] }).cmd.push(function () {
  // interact with API safely
});