Optimize the Dailymotion Player for Header Bidding solutions
Introduction
The Dailymotion Player enables you to know when an ad slot is ready to be filled during a video session. In this guide, we’ll show you how to implement the right parameters to optimize for header bidding solutions all ad slots available in the Player.
Implementation steps
1. Allow your player to work with your Prebid solution
The Player setting enable_wait_for_custom_config
allows the Player to work more efficiently with advertising solutions such as Prebid.
This setting can be activated via the Platform API by either creating a new Player configuration or updating an existing one (see code sample below). If you’re not confortable using the API, reach out to your Dailymotion Account Manager so we can activate it for you.
Platform API code sample:
With the below example, you can update an existing Player to enable the setting enable_wait_for_custom_config
// Enable the parameter enable_wait_for_custom_config on an existing Player
// Replace <YOUR_PLAYER_ID> with the Player ID you want to modify
curl -X POST -H 'Authorization: Bearer ${ACCESS_TOKEN}' \
-d 'enable_wait_for_custom_config=true' \
'https://api.dailymotion.com/player/<YOUR_PLAYER_ID>'
Once the Player setting is enabled:
- The Player ad values can be updated during the current video session
- The new Player event
AD_READYTOFETCH
becomes accessible via the SDK and signals when an ad is about to play (see step 5)
2. Embed a Player with the associated Player ID
You can now embed on your webpage the Player from step 1 and your video.
// Replace {Player_ID} and {Video_ID} with your own
<script
src="https://geo.dailymotion.com/player/{Player_ID}.js"
data-video="{Video_ID}" id="myPlayer"
></script>
3. Get the Player and fetch ad values
Using Promise.all([...])
, run both promises in parallel: getPlayer()
to retrieve your Player, and your first Prebid request for your Pre-roll.
// Replace myFetchPrebid() with your own Prebid request
Promise.all([dailymotion.getPlayer('myPlayer'), myFetchPrebid()])
.then(([player, customConfig]) => {
4. Update the Player with retrieved ad values
Once both promises are successfully resolved – meaning that the Player is retrieved and the ad values are returned – you can update the Player for your first Pre-roll with the ad values from setCustomConfig()
.
player.setCustomConfig(customConfig)
5. Add an event listener for the next ads
By enabling the Player setting enable_wait_for_custom_config
in step 1, you have access to the ad event AD_READYTOFETCH
which is sent a few seconds before an ad is supposed to play.
After the event is sent, the Player will wait to send the ad request. Depending on the ad position, the Player waits as follow:
Ad Position | Wait time (seconds) |
First pre-roll | 2 |
Consecutive pre-roll | 4 |
Mid-roll & Post-roll | 6 |
Add the event to your integration to know when a new ad is about to play. Each time it is caught, you can update the advertising values sent to your header bidding solution and pass them to the Player using setCustomConfig()
.
player.on(dailymotion.events.AD_READYTOFETCH, (state) => {
myFetchPrebid(state)
.then((customConfig) => {
player.setCustomConfig(customConfig)
})
Optional: Skip request on specific ad positions
If you don’t want to make header bidding calls for midrolls and/or postrolls, you can set an empty value in setCustomConfig({})
when listening to a specific ad position with AD_READYTOFETCH
.
Code sample:
In the following example, if the event AD_READYTOFETCH
detects a midroll, no header bidding request is triggered. If it detects any other ad slot (postroll or subsequent preroll), a header bidding request will be made.
player.on(dailymotion.events.AD_READYTOFETCH, state => {
if (state.adPosition === 'midroll') {
player.setCustomConfig({}) // skip
} else {
myFetchPrebid(state)
.then(customConfig => {
player.setCustomConfig(customConfig)
})
.catch(err => {
console.error(err)
})
}
})
Code sample
The following code sample implements the steps described above: