Share a playlist in Wowza Video

Wowza Video generates several viewing formats for your stream, giving you flexibility in presentation. You can use one viewing format or combine them for a more robust viewing experience. 

A playlist is shared using code that you can use to host the player in your own site or through a Wowza Video hosted page. The embed code or hosted page loads Wowza Flowplayer with the playlist plugin to play the videos in the playlist in sequence. 

We provide the following ways to embed a playlist:

  • Hosted page embed code
  • Iframe embed code
  • JavaScript embed code

Note: To embed a playlist, you need a player configuration that you can embed the playlist within if you don't already have one.

Share a playlist

To share a playlist in Wowza Video:

  1. Click Playlists in the navigation.
  2. View and select the playlist you want to share on either the Manual tab or the Dynamic tab.
  3. Click Share Playlist to display the viewing formats we provide.
  4. Choose from one or more of the viewing formats and either share the hosted page or update your site with the embed codes:
    • Hosted page URL — Copy this URL and share it directly with your viewers. Wowza Video automatically generates a web page, that we host for you, and embed with the specified player. 
    • iFrame embed code — Copy this code and add it to your site to embed an iFrame with the specified player into your own site.
    • JavaScript embed code — Copy this code and add it to your site to embed the specified player into your own site. 

If you don't have a player configuration, create a new player configuration that suits your specific requirements first. 

Embed a playlist using iframe

Using an iframe embed code is a standard way to embed media content and many services provide this as the only option. We recommend using iframe embeds to host on your site unless you specifically need something else. This iframe embed provides you with the following advantages:

  1. The code is easy to copy.
  2. The video player is isolated in its own “window” which prevents potential conflicts with other items on the page.

The iframe embed code looks like this:

<div class="flowplayer-embed-container"
     style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width:100%;">
  <iframe style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
          webkitAllowFullScreen mozallowfullscreen allowfullscreen
          src="//embed.flowplayer.com/api/video/embed.jsp?id=ddse9cb9d-b670-4453-a6bd-6c66e8d291e4&pi=3480668e-2322-4c18-b11a-92af07d07dd6"
          title="0" byline="0" portrait="0"
          width="640" height="360"
          frameborder="0" allow="autoplay"></iframe>
</div>

The iframe embed link provides you with a few options to override the player configurations.

Using an iframe embed code limits the amount of interaction with the player since it resides in its own window. If you want to access the player object directly to programmatically interact with it, or customize it more than what is provided using the iframe embed options, you should use the JavaScript embed code.

Embed a playlist using JavaScript

If you want to programmatically work with the video player, the best option is to use the JavaScript embed for use in your own site. This allows you to interact with the video player and access the Wowza Video API 2.0.

The JavaScript embed code looks like this:

<div id="player-26fd1cb2-c658-4164-8fb8-d561a069d2ef"></div>
  <script type="module">
    import flowplayer from "https://embed.flowplayer.com/cf71b369-98f1-4e17-bb7e-1209409fb7e9/26fd1cb2-c658-4164-8fb8-d561a069d2ef.js";
    flowplayer("#player-26fd1cb2-c658-4164-8fb8-d561a069d2ef",
               { });
  </script>