Publishing Videos with the Media Module

Video Cloud
Studio User
Player Developer
Publish Videos

In this topic you will learn how to publish videos using the Media module.

The Media module provides a publish option to publish videos to the Web, Email, Social Networks or a Gallery In-Page Experience. This topic contains information on publishing videos and playlists to the web. For information on the other publishing options, see:

If you are looking to dynamically assign video content to a player, get the embed code for the player and then use one of the techniques available to dynamically assign content to a player.

This topic is organized into the following sections:

Note: For information on playlists, see Creating and Managing Playlists.

Publishing videos

To publish a video or playlist, follow these steps.

  1. Click Media in the navigation header to open the Media module.
  2. To publish a single video, click All Videos in the side navigation panel and then do one of the following:
    • Click the checkbox next to the video and then click Publish > Brightcove Player (Web)
    • Click on the video name and then clickPublish > Brightcove Player (Web) on the video properties page
  3. To publish a playlist, click All Playlists in the side navigation panel and then do one of the following:
    • Click the check box next to the playlist and then click Publish > Brightcove Player (Web)
    • Click on the playlist name and then click Publish on the playlist videos page
  4. Confirm that the publishing dialog opens. The name of the video or playlist being published will appear in the publishing dialog title.

    Known Issue: Since the preview player is being loaded over HTTPS within the Studio, if your content is being served over HTTP, the preview player will not playback the content and your browser will display an insecure scripts message. This is not a Studio bug but a browser security limitation.

  5. Select a player to use. When publishing playlists, there are some player properties that can be set to control whether the playlist auto advances to the next video and if the playlist appears next to the player. See the Player playlist properties section below for details.

    Note that the preview will update to display the player that was selected.

  6. (Optional) The preview link below the preview player can be used to preview the player in another browser tab. Click the Shorten button to generate a shortened URL.
  7. Choose an option for the player sizing:
    • Responsive - The player size will adjust automatically based upon the browser size
    • Fixed - The player size is based upon the width and height parameters
  8. Select an aspect ratio for the player.
    • 16:9 or 4:3 - enter a player width (the height will be determined automatically)
    • Custom - to manually enter the player width and height
  9. Enter the Player Width and Player Height.
  10. Select the Units of measurement.
  11. Select the type of publishing code to copy by clicking iframe or In-Page.
    • Standard - iframe embed code - Recommended for most cases. This type places the player inside an <iframe> tag. If player dimensions are specified, the iframe will be sized to the player dimensions. If no player dimensions are specified, the iframe can be placed inside of a <div> tag and the responsive nature of the player will resize the player to occupy the entire space of the <div> .

      Note: The iframe width must be larger than 640px for the playlist to appear.

    • Advanced - In-page embed code - Allows the player to exist in the the HTML page directly, not in an iframe. This offers developers the benefits of ease of accessing the player and associated properties and events. By using the in-page embed code, you lose the ease of use of the player as a single, contained unit in social media applications and sharing. This option is available only for the published player.
    For more information on the types of publishing code, see Choosing the Correct Embed Code.
  12. Copy the publishing code. When finished, click Done.

Adding an application ID to the embed code

In the past, publishers would commonly create new players with different names to use on different parts of a site or to use on different sites. When reviewing player analytics, having different player names made it easier to determine which players were getting the most views. By adding an application ID parameter to the embed code, the same player can be used across a site, or sites, and the application ID can be used to identify where the player was published. Using a player application ID can help reduce the number of players that need to be created and maintained. For information on adding an application ID to the embed code, see Adding an Application ID to the Player Embed Code.

Player playlist properties

When publishing playlists, there are some player properties that can be configured that control player sizing, whether the playlist auto advances to the next video and if the playlist appears next to the player.

To configure the playlist related player properties, follow these steps.

  1. Open the Players module.
  2. (Optional) Create a new player that will be used for publishing playlists.
  3. Click on the player name to open the player properties.
  4. Locate the Settings section and click Edit.
  5. Several player properties can be used to control the playlist behavior.
    • Display Playlist - When Enabled, will display the videos in the playlist on the right side of the player. Note that a maximum of 20 videos will be displayed when this option is selected. This example shows a player with Display Playlist set to Enabled and a Playlist Version of V2.
    • Auto Advance to Next Video - When set to Yes, will advance to the next video in the playlist when the current video finishes playing.
    • Play On Select - When set to Yes, clicking a thumbnail in the playlist menu will cause the video to play when loaded, even if the previous video in the player was paused.
    • Playlist Version - The playlist UI version to use. V2, shown above, will hide and show the playlist when the viewer clicks the > control. The V1 UI displays the playlist all the time.
    • Adjust Player Dimensions for Playlist - When checked, will modify the player size to accommodate the display of the playlist. Only displays when using the V1 Playlist Version.
  6. Click Save to save changes.

Remember to publish the player changes so they appear in the published player.

When using the Standard (iframe) embed code, the playlist has a show/hide button and is automatically sized and positioned. When using the Advanced (in-page) embed code, you must insert the playlist as an HTML <ol> element and write your own CSS to position and size the playlist. This gives you full control over the playlist's display. In the latter case, the playlist does not even need to be adjacent to the player if you don't want it to be. The In-page embed player section of the Implementing Playlists Programmatically document has substantial content on formatting and styling a playlist.