Leading with HTML5


Engage and monetize audiences everywhere

Leading with HTML5

Customize your player

The Ooyala Player is built for the post-Flash world. Also known as Player V4, it provides a better viewing experience, supports the latest streaming formats and IAB standards, is easier to customize, and integrates with third party ad managers and analytics providers.

planning your migration

Planning Your Migration

The sooner you migrate to Player V4, the sooner you’ll realize its many benefits. Here are some good reasons to upgrade.

To create a migration plan, we recommend that you gather information about your current use of Player V3, using the list and resources below. Understanding impacted functionality will help determine the migration timing and needed developer resources.


  1. Review the Player V4 Support Center overview and migration documentation
  2. In many cases moving to Player V4 will require changes to your Ooyala implementation. The below list identifies the impacted features along with links to the relevant documentation.
    • HLS Remote Assets

      If you’re serving your page via HTTPS (SSL) please contact our Technical Support team.

    • Third party plugins (ad servers and/or analytics)

      If you are using Ooyala ad modules in Player V3, please refer to Player V4’s Ad Manager Framework plugins; they include Ooyala Pulse, Google IMA, VAST and FreeWheel. See our Ad Manager online guide for more details.

    • Custom Player Modules

      These are third-party integrations built by your team or Ooyala Professional Services. Some examples include:

      • Custom Discovery End-Screen: We recommend that you leverage Ooyala Player V4’s default out of the box Discovery functionality. Refer to Player V4 plugins for more information.
      • Playlists Pods: The Playlist functionality is not yet a supported feature of Player V4. Contact Technical Support for guidance on implementation.
    • Customized HTML5 player skins

      If you are using the V3 HTML5 Player you may be using custom CSS to style the player skin. Moving to Player V4 provides greater customization flexibility using the React framework. See the skin configuration page for details.

    • Ooyala Theme Builder

      Ooyala Theme Builder only supports skin customization for the Ooyala Flash Player. When moving to Player V4, all skin customization is done via skin.json

  3. Schedule time with your account manager to create a plan and discuss timing for your migration. If you are unclear who your account manager is, or have other questions, please contact Technical Support.

Additional Resources


Ooyala Player Overview & How to Migrate

Watch Webinar

Why Upgrade to Player v4?

There are many benefits to upgrading to the new HTML5 Ooyala Player:
  • Player V4 is HTML5-based, which is the new standard. It will ensure the broadest reach for your content as the industry moves away from Flash.
  • More consistent performance across devices through the new responsive UI and faster player load times.
  • Support of MPEG-DASH and HLS across all browsers with HTML5, as well as Flash playback capability to seamlessly play Flash HDS videos.
  • A tailored viewing experience that’s easy to customize with branding, social sharing, localization, Ooyala Discovery capabilities and more.
  • Flexible Ad Manager Framework allows integration of ad managers and IAB standards including FreeWheel, Google IMA (DFP), LiveRail, VAST and VPAID supporting a variety of ad rules like pre-, mid-, post-rolls and clickthroughs.
  • The ability to track video plays using Ooyala IQ analytics and a flexible analytics framework that integrates with other third party providers.
  • Content Aware Controls for VoD, Live, Ads, and DVR.
  • Closed Captions with multi-language functionality via DFXP and webVTT.


What do I need to do to upgrade?

To load existing video assets with Player V4, simply create a new Player V4 and associate the embed code of the existing video.

  1. Retrieve and write down your Player V4 embedCode, playerBrandingId, and pcode.
  2. Follow the instructions in the documentation and create a V4 player, substituting your own embedCode, playerBrandingId, and pcode from step 1. Alternatively, you can go to the Player V4 html5-skin repo README at https://github.com/ooyala/html5-skin#examples and substitute your embedCode, playerBrandingId, and pcode into the example page.
  3. Update your ad configuration parameters (see Migrating to Ooyala Player V4 for details). With the new Ad Manager Framework for Player V4, configuration parameters and some page level settings are different from Player V3. If you don't have any page level overrides to Backlot settings, your ads will have full backwards compatibility.

See Migrating to Ooyala Player V4 for full migration steps and details.

Will the current player I’m using continue to be supported?

Previous versions of the Ooyala Player will continue to be supported, however, we recommend that all customers upgrade to the new HTML5 Ooyala Player as soon as possible to maintain your audience reach and take advantage of the improved performance, configurability and integrations.

What if I don’t have developer resources in house to assist with the migration?

Please contact your customer success manager or Technical Support to get more information about engaging Ooyala services to help with your migration.

How does Player V4 differ from the player we’re currently using?

Player V4 has a new responsive and customizable UI that you can use out-of-the-box or customize to your branding needs. Modify a simple JSON file or the player CSS to make branding and UI customizations. Note: While you will still use Backlot to create a Player ID, you can no longer use the Backlot UI to make player customizations.

Player V3 was Flash-first by default, whereas Player V4 is HTML-first by default. As Player V4 is built with HTML and JavaScript, Player V4 will only render Flash videos if you load a specific Flash plugin and prioritize HDS videos in your encoding priority settings.

Player V4 is a modular player consisting of plugins, which means that you can add or remove certain functionality depending on which plugins you load on your HTML page. The modular architecture of Player V4 allows for faster load times and increased customizability.

Player V4 features a new Ad Manager Framework with robust ad support and an Analytics Framework that allows you to integrate third-party analytics providers with the player. See Player V4 for a full list of features.

What can I configure in the new player?

Player V4 is highly customizable. You can:

  • Enable Discovery content recommendations.
  • Configure the player look and feel (skin) using a JSON config file, by specifying player settings directly in HTML pages, or by modifying the Player CSS and resources.
  • Use the message bus to make additional event-driven customizations.
  • Localize player controls and error messages.
  • Configure HTML5 or Flash video rendering. Note that all of the plugins, ad logic, UI, Player APIs, etc. are always in HTML5. The only Flash component is video decoding and rendering for HDS.

How can I customize the look and feel of Player V4?

  1. Make easy customizations by modifying a JSON config file that applies across environments.
  2. Use embedded parameters on the page (HTML5 only) to override skin settings when you create the player through embedded parameters on the page level.
  3. Developers can fork the player skin repositories and customize the source code and customize the Player CSS.

All Player V4 FAQs