Prebid Video | Instream Example with JW Player (Platform)

An example of an instream pre-roll ad using Prebid.js and JW Player (Platform).

Important: This example uses a test version of Prebid.js hosted on our CDN that is not recommended for production use. It includes all available adapters. Production implementations should build from source or customize the build using the Download page to make sure only the necessary bidder adapters are included.

Warning: Do not forget to exchange the placementId in the code examples with your own placementId!

Place this code in the page header.


<!--Prebid.js and video player code-->
<script async src="//acdn.adnxs.com/prebid/not-for-prod/1/prebid.js"></script>
<script>
    var pbjs = pbjs || {};
    pbjs.que = pbjs.que || [];

    // define invokeVideoPlayer in advance in case we get the bids back from prebid before the entire page loads
var tempTag = false; var invokeVideoPlayer = function(url) { tempTag = url; } var videoAdUnit = { code: 'video1', mediaTypes: { video: { playerSize: [640, 480], context: 'instream' } }, bids: [{ bidder: 'appnexus', params: { placementId: 13232361, //put your placement id here
video: { skipppable: true, playback_method: ['auto_play_sound_off'] } } }] }; pbjs.que.push(function() { //put your adunits here
pbjs.addAdUnits(videoAdUnit); pbjs.setConfig({ debug: true, cache: { url: 'https://prebid.adnxs.com/pbc/v1/cache' } }); pbjs.requestBids({ bidsBackHandler: function(bids) { var videoUrl = pbjs.adServers.dfp.buildVideoUrl({ adUnit: videoAdUnit, params: { iu: '/19968336/prebid_cache_video_adunit', cust_params: { section: 'blog', anotherKey: 'anotherValue' }, output: 'vast' } }); invokeVideoPlayer(videoUrl); } }); }); </script>

Place this code in the page body.

  
<div id="myElement1"></div>

<!-- Replace this with the correct url for your player -->
<script src="https://content.jwplatform.com/libraries/72xIKEe6.js"></script>
<script>
    // we initialize our player instance, specifying the div to load it into
var playerInstance = jwplayer('myElement1'); function invokeVideoPlayer(url) { // this calls setup on the player we initialized   // this will use the settings defined in the player we loaded above unless you override them here
playerInstance.setup({ // this line loads a playlist from your jwplatform account (in either json or rss format)   // this can also be a single media file by specifying 'file' : 'content.jwplatform.com/videos/VIDEOKEY.mp4'   // Replace this with the correct url for your playlist
"playlist": "https://content.jwplatform.com/feeds/ae4tmw2D.json", "width": 640, "height": 480, // we enable vast advertising for this player
"advertising": { "client": "vast", // url is the vast tag url that we passed in when we called invokeVideoPlayer in the header
"tag": url, }, }); } if (tempTag) { invokeVideoPlayer(tempTag); tempTag = false; } </script>