To start integrating your Ooyala player into the *Plugin SDK, click on your video within the Ooyala backlot and click on the embed tab at near the bottom of the screen. Find the HTML5 embed code and click “Copy.” This will copy a chunk of JavaScript and HTML code that should look something like this:
<script src='//player.ooyala.com/v3/ODFjYmU3NmNiN2VkNDg1YjNlMGMwYTIz'></script><div id='ooyalaplayer' style='width:1920px;height:1080px'></div><script>OO.ready(function() { OO.Player.create('ooyalaplayer', '00dTZiNTr4a03bt80D7DzrUWEQtWC5bf'); });</script><noscript><div>Please enable Javascript to watch this video</div></noscript>
Pull out the first script tag and place it in the page header. Then wrap the remaining code in your p3sdk-container as shown below. Be sure to assign the OO.Player.create call to a window variable that is identical to the id of the p3sdk div and your player_id, and replace the “ooyalaplayer” argument with that same id (shown in pink).
<div class="p3sdk-container p3sdk-debug" player_id="ooyala-player-6" player_type="ooyala" >
<div id='ooyala-player-6' style='width:480px;height:360px;'></div>
<script type="text/javascript">
OO.ready(function(){
window["ooyala-player-6"] = OO.Player.create(
'ooyala-player-6',
'00dTZiNTr4a03bt80D7DzrUWEQtWC5bf', {
}
);
});
</script>
(...transcript code)
</div>
</div>
*The Plugin SDK is sometimes referred to as "P3SDK"