Example: Ad Impression Verification

This page has moved to our new developer site!  Please visit the updated location here.

Thanks for your patience while we update our documentation.

You will be automatically redirected in 10 seconds.

 


 

This document applies to users of JW Player Ads. Don't have Enterprise? Upgrade Now.

Here is an example of a setup of JW Player with preroll VAST tag. Various Advertising API calls are used to verify impressions, clicks, progress and completes:

 
 
  1. (no ad impression yet)
  2. (no ad progress yet)
  3. (no ad click yet)
  4. (no ad complete yet)

Embed code

As always, ensure you have uploaded a copy of JW Player and included the script in the <head> of your page, together with your player key. See the Quick Start Guide for more info. Next, place the following embed code at the location you want the player to appear:

<div id="myElement"></div>
<script>
var playerInstance = jwplayer("myElement");
  playerInstance.setup({
    image: "/uploads/myPoster.jpg",
    file: "/uploads/myVideo.mp4",
    advertising: {
      client: "vast",
      tag: "//adserver.com/vastFile.xml"
    }
  });
</script>

Script code

With the player set up, it's time to add the code for verifying ad playback. First, include a bit of HTML to print the verification into:

<ol>
  <li id="impression">(no ad impression yet)</li>
  <li id="progress">(no ad progress yet)</li>
  <li id="click">(no ad click yet)</li>
  <li id="complete">(no ad complete yet)</li>
</ol>

Next, insert the scripting code to listed to the various Advertising API events and print the results into the HTML:

<script type="text/javascript">
playerInstance.on("adImpression",function(event){
  setElement("impression","The ad impression was fired.");
});
playerInstance.on("adTime",function(event) {
  var remaining = Math.round(event.duration-event.position);
  setElement("progress","The ad completes in "+remaining+" seconds.");
});
playerInstance.on("adClick",function(event){
  setElement("click","The user clicked the ad.");
});
playerInstance.on("adComplete",function(event){
  setElement("complete","The ad was completely watched.");
});

function setElement(element,message){
  var div = document.getElementById(element);
  div.innerHTML = message;
  div.style.color = "#090";
}
</script>

Did you find this article helpful?

Please log in to rate this article.