Integrating Multiple Ad Managers

You can load and use multiple ad plugins (only the Freewheel, VAST, and Google IMA ad plugins) on a single page. If all three were loaded on a page, for example, and you had multiple embedded players on the page, Player A and Player B could both use IMA, Player C could use Freewheel, and Player D could use VAST.
Note: If you want to use the Pulse plug-in, consider using an iFrame instead. If you load the pulse plugin and do not give it ads, you get unexpected behaviors.
See Ad Manager Framework for an overview and Integrating Ads for an introduction.

Step 1: Load the Plugins on the Page

Consider the following requirements:
  • You can load multiple ad plugins on a page, as long as you use only the Freewheel, VAST, and Google IMA ad plugins.
  • Plugins should all be the same Player V4 version.
  • You can load only one version of the same ad plugin on a page. For example, you cannot load two different versions of the Freewheel plugin on the same page.
  • Load only the plugins you intend to use on that page.
To load an ad plugin, add the following script (after you load core.min.js) to the page where you are loading the players. For example, to load all three ad plugins:
<script language=“javascript" src="url_where_hosted/freewheel.min.js"></script>
<script language=“javascript" src="url_where_hosted/ad_manager_vast.min.js"></script>
<script language=“javascript" src="url_where_hosted/google_ima.min.js"></script>                
Replace url_where_hosted with the URL where you host the resource.

Step 2: Load and Configure Players on the Page

Consider the following requirements:
  • Multiple embedded players on a page can access the same ad plugin.
  • However, you can use only one ad plugin per embedded player. For example, Player A and Player B can use only IMA, not IMA and VAST.
After the applicable ad managers are enabled on your page, you can configure general ad settings with embedded parameters. You can also configure your ad manager-specific settings, as described in:

Example

Replace url_where_hosted with the URL where you host the resource.
<!DOCTYPE html>
<html>
   <head>
      <script src="url_where_hosted/core.js"></script>
      <script src="url_where_hosted/ad-plugin/freewheel.js"></script>
      <script src="url_where_hosted/ad-plugin/ad_manager_vast.js"></script>
      <script src="url_where_hosted/ad-plugin/google_ima.js"></script>
      <script src="url_where_hosted/video-plugin/bit_wrapper.min.js"></script>
      <script src="url_where_hosted/video-plugin/main_html5.min.js"></script>
      <script src="url_where_hosted/video-plugin/osmf_flash.min.js"></script>
      <script src="url_where_hosted/skin-plugin/html5-skin.min.js"></script>
      <link rel="stylesheet" href="url_where_hosted/skin-plugin/html5-skin.min.css"/>
   </head>
   <body>
      <!-Shared Feature iframe->
      <div id='ima' style="width:900px;height:600px"></div>
      <div id='vast' style="width:900px;height:600px"></div>
      <div id='freewheel' style="width:900px;height:600px"></div>
      <script>
          var playerParam = {
            "autoPlay": false,
            "pcode": "your_pcode",
            "playerBrandingId": "your_brandingid",
            'debug':true,
            "skin": {
            "config": "//player.ooyala.com/static/v4/stable/latest/skin-plugin/skin.json",
            "inline": {"shareScreen": {"embed":
                 {"source": "<iframe width='640' height='480' frameborder='0' allowfullscreen src='//player.ooyala.com/static/v4/stable/latest/skin-plugin/iframe.html?ec=<ASSET_ID>&pbid=<PLAYER_ID>&pcode=<PUBLISHER_ID>'></iframe>"}
                     }}
                },
             };
          var playerParamFreewheel = {
             "autoPlay": false,
             "pcode": "your_pcode",
             "playerBrandingId": "your_brandingid",
             'debug':true,
              "skin":
                  {
                      "config": "//player.ooyala.com/static/v4/stable/latest/skin-plugin/skin.json",
                      "inline":
                      {
                        "shareScreen":
                          {
                             "embed":
                              { "source": "<iframe width='640' height='480' frameborder='0' allowfullscreen src='//player.ooyala.com/static/v4/stable/latest/skin-plugin/iframe.html?ec=<ASSET_ID>&pbid=<PLAYER_ID>&pcode=<PUBLISHER_ID>'></iframe>" }
                           }
                       }
                     },
                     "freewheel-ads-manager":
                        { "fw_video_asset_id":"111111111111111111111111111111111", "html5_ad_server":"//g1.v.fwmrm.net", "html5_player_profile":"90750:ooyala_html5", "fw_mrm_network_id":"380912" }
                 };
             OO.ready(function()
             { window.pp = OO.Player.create('ima', '222222222222222222222222222222222', playerParam); 
               window.pp2 = OO.Player.create('vast', '333333333333333333333333333333333', playerParam); 
               window.pp3 = OO.Player.create('freewheel', '444444444444444444444444444444444', playerParamFreewheel); }
           );
       </script>
   </body>
</html>

Was this article helpful?