Player configuration

After you embed Wowza Flowplayer, it can be configured through the manual Javascript player setup below. Configuration is added to the flowplayer() call in the second argument:

flowplayer('#player_container', {
    src: "my_video.mp4"
  , token: "<my_token>"
  , title: "my video"
  , autoplay: true

Configuration options

Wowza Flowplayer uses the configurations mentioned in the Core Player Configuration table below by default. You can override them by manually setting options.

All other configuration options (Autoplay, User Interface, and Plugins) need to be set manually by adding them to the embed code.

Core player configuration

Option Description Parameters Example
Playlists: Whether to auto advance to next clip. true,
false (default)
advance: true
When true, the player requests fullscreen when going from portrait to landscape. This does not guarantee fullscreen occurs. Many modern platforms have similar best-effort rules like auto play for this behavior. true,
false (default)
auto_orient: true
Whether a player should auto pause when it's outside of the viewport. true,
false (default)
autopause: true
boolean or bitflag
Whether the player should auto play. Autoplay bitflags exist at flowplayer.autoplay.
When using bitflags don't add quotation marks. For example, use autoplay: flowplayer.autoplay.ON.
false (default),
flowplayer.autoplay.AUDIO_REQUIRED, or use numeric values. See the autoplay options table.
autoplay: flowplayer.autoplay.AUDIO_REQUIRED
When set to false, the control bar doesn't display. See also the corresponding NO_CONTROLS ui bitflag. true,
controls: false
Descriptive text to show when hovering the player. none (default)
text string
description: "This is a video about videos, showing how to view videos"
If true, seeking forward with mouse or keyboard is disabled. Can be switched with the toggleDisable() API method. true,
false (default)
disabled: true
Forces the dvr feature for live streams, overrides automatic detection. See also seconds_to_dvr. true,
dvr: true
Sets the language of the player UI and its messages. Requires loading the language file. ISO code for the language lang: "fr"
Adds a custom logo to the player. See also the logo skinning docs. url string logo: ""
Optional image text that describes the custom logo for the player and helps with accessibility. none (default), text string logo_alt_text: "Wowza Flowplayer logo"
An optional url which redirects the user when clicking the logo. none (default), text string logo_href: ""
Whether the player should loop the current video or playlist. true, false (default) loop: true
If true, then the UI shows only live controls (mandatory for live streams). true,
false (default)
live: true
Whether the player should continue to play if another player on the current page also begins playback. true, false (default) multiplay: true
Whether the player should start with sound turned off. true,
false (false)
muted: true
Show a custom image instead of first frame of a video. none (default)
url string
poster: ""
Whether to preload the video clip or its metadata. auto attempts to load the complete video clip (this might impose high bandwidth usage on page load even if the visitor does not start the video). none (default,
preload: "auto"
Presets the player dimensions ratio in width:height format according to the dimensions of the video clip or live stream, either as calculated aspect ratio or using the real dimensions. "width:height" ratio: "16:9" ratio: "1280:720" ratio: "1.7:1"
If true, the player retries connecting to a live URL (RTS@scale, WebRTC, HLS, or DASH) every three seconds. Useful if you embed the player before the live stream is available and you don't have any other retry mechanism in place. For HLS and DASH live streams, live: true must also be set. true (default), false retry: true
If set to true , the player returns to the start after playback has finished, showing either the poster image (if configured) or the first frame of the clip. true,
false (default)
rewind: true
Indicates seconds of live content to be buffered before dvr is enabled. This is the length of buffered content, not the time the stream is running. Do not use in combination with dvr: true|false as the dvr option will override any seconds setting. 60 seconds (default) seconds_to_dvr: 30
Enables or disables seeking back or forth in the timeline. Can be switched at runtime with the setOps() API method method. true (default),
seekable: false; (flowplayer.setOpts({seekable: true|false}))
Playlists: true randomizes the playback order of the playlist items. true , false (default) shuffle: true
Playlists: Display playlist skip controls in the player control bar. true , false (default) skip_controsls: true
The video source. The source configured in the embed code serves as the default. see Video source
Defines one of three possible start qualities for HLS sources, calculated from the levels available in the master manifest. 1 (LOW), 2(MEDIUM), 4 (HIGH) start_quality: 4
Starts with the highest level
Defines a start time that differs from the beginning of a clip for VOD or live stream content. This setting only has an effect initially. Changing it with setOpts() is not possible. For VOD content, this is a number in seconds or fractions of a second.

For live streams, the default value -1 starts the live stream from the edge. Set to 0 to start the live stream from the beginning of the broadcast.
VOD example:
start_time: 60,
start_time: 10.5

Live stream example:
start_time: 0
Title to show when hovering the player. none (default), text string title: "Video about videos"
string [hash=attr-token/]
Used to ensure only valid domains use your assets. alphanumeric,
special character string
token: "areallylongsrandomstringfromtheui"
A bitmask disabling certain UI elements like full-screen mode, mute, and volume. none (default)
See the UI configuration. This is translated to an integer internally, so do not add quotes.
ui: flowplayer.ui.NO_VOLUME_CONTROL

Autoplay configuration

Autoplay can be configured in several ways either with the bitmask parameter or the numeric value representing it:

Option Description Value
flowplayer.autoplay.OFF Autoplay is disabled. 0
flowplayer.autoplay.ON Autoplay is enabled, if the browser does not allow autoplay with audio it will use muted autoplay. 1
flowplayer.autoplay.AUDIO_REQUIRED The player will attempt autoplay. If it can only proceed in a muted state, it will not attempt to play while muted and instead shows the initial starting screen. 2

Use autoplay with caution and keep in mind that most browsers do not allow autoplay with sound in many situations; we expect policies to become even more restrictive in the future. Autoplaying videos can be an irritant to users (especially when muted) and might waste bandwidth and battery energy. Check the current browser policies here:

User interface configuration

The following options are available in the ui configuration object. To combine several options, add the values and configure the sum.


NO_HEADER | NO_TITLE | LOGO_RIGHT will have the numeric values 4096 | 256 | 8 and the resulting config value for "ui": will be 4360.

Option Description Numeric Value
AUDIO_ONLY Force audio player minimal UI (requires audio plugin) 8192
LOGO_ON_RIGHT Show custom logo in right corner of the player 8
LOGO_ON_BOTTOM Show custom logo on bottom of the player 32768
NO_CONTROLS Disable the complete control bar 1024
NO_DESCRIPTION Don't show clip description metadata (since v1.12.0) 512
NO_DURATION Disable display of clip duration on start screen 2048
NO_FULLSCREEN Hide fullscreen button 1
NO_HEADER Disable the header which holds the logo, as well as the share, cast and fullscreen buttons 4096
NO_MUTE Hide mute button 4
NO_TITLE Don't show clip title (since v1.12.0) 256
NO_TOUCH_ZONES Remove the seek touch zones on mobile devices 16384
NO_VOLUME_CONTROL Hide volume control bar 2
USE_DRAG_HANDLE Add a round scrubbing handle to the timeline 16
USE_PLAY_2 Use alternate play (outlined) button in the center of the player 32
USE_PLAY_3 Use alternate play button (circled) in the center of the player 64
USE_THIN_CONTROLBAR Uses a thinner control bar that gets taller when the mouse is hovering the player 128

Note the UI flags are configured without quotes and are case-sensitive.

UI configuration sample code

<!doctype html>
  <title>ui flags</title>
  <link rel="stylesheet" href="//">
  <script src="//"></script>
  <!-- Optional plugins -->
  <script src="//"></script>
<div id="player_container"></div>
flowplayer("#player_container", {
  src: ""
, token: "<yourtoken>"
, ui: flowplayer.ui.NO_VOLUME_CONTROL | flowplayer.ui.NO_MUTE | flowplayer.ui.NO_FULLSCREEN

Plugins configuration

Wowza Flowplayer can be extended through plugins. All plugins are configured at the top level. To load them, just add the plugin urls after the core player.

To configure, set a configuration object at the top level and include the desired options as explained in the linked plugin documentation below:

Plugin Option Description Example
Advertising ima
Ad configuration. Only available on Professional and Enterprise plans. Default: none ima: {...}
See Advertising plugin for details.
AirPlay airplay
Implements an Apple AirPlay feature that allows you to play content on AirPlay devices. An AirPlay device selection button appears when AirPlay devices are available in the same WiFi network. Just load the AirPlay plugin. Do not add the config string.
Audio Track Selection asel
object or boolean
Adds support for multiple audio tracks in HLS or DASH streams. See Audio Track Selection plugin for details.
Chromecast chromecast
Implements a Chromecast feature that plays content on Chromecast enabled devices. A Chromecast device selection button appears when Chromceast devices are available in the same WiFi network and you're using a Chromecast-enabled browser. Just load the Chromecast plugin. Do not add the config string.
Comscore Analytics comscore
Allows you to track your media content in Comscore. See Comscore Analytics plugin for details.
Cuepoints cuepoints
Adds cuepoint support to the player. See Cuepoints plugin for details.
Implements an MPEG-DASH loader plugin, which is capable of playing .mpd source files. See MPEG-DASH plugin for details.
Endscreen Configured with API call. Adds support for an recommendation end screen. The end screen is displayed at the end of a single video or after the last item of a playlist. It contains a grid view of recommended videos (if available). See Endscreen plugin for details.
Float-on-Scroll float-on-scroll
Turns the player into a floating container that positions the player in the lower left corner (site and position configurable with css) when user scrolls past the player. float-on-scroll: false
Frame-Accurate Seeking fas
Adds support for seeking to specific frames and SMPTE timecodes. fas: {}
See Frame-Accurate Seeking plugin for details.
Google Analytics: GA4 ga
Allows you to track your media content in Google Analytics. ga: {}
See Google Analytics: GA4 plugin for details.
Gemius Analytics gemius
Allows you to track your media content in Google Analytics. gemius: {}
See Gemius Analytics plugin for details.
HLS hls
Implements an HLS loader plugin, which is capable of playing .m3u8 source files. hls: {}
See HLS plugin for details.
HTML Subtitles subtitles
Lists subtitle tracks. Default: none subtitles: {tracks: []}
See HTML Subtitles plugin for details.
Keyboard keyboard
Loads the accessibility helper keyboard plugin, which also allows searching with keyboard shortcuts at pre-defined intervals. keyboard: {}
See Keyboard plugin for details.
Playlist playlist
array and others
Ads support for playlists. Must be initialized with flowplayer/playlist src type. playlist: []
See Playlist plugin for details.
Quality Selection qsel
Implements a quality-selector menu where the different quality levels of a stream are offered for manual selection. qsel: {}
See Quality Selection plugin for details.
Share share
Adds a share button to offer social media linking. share: {}
See Share plugin for details.
Speed Selection speed
Adds a playback speed selector menu item with configurable slow/fast playback options. speed: {}
See Speed plugin for details.
Preview Thumbnails thumbnails
Adds WebVTT-based thumbnail support. thumbnails: {src:""}
See Preview Thumbnails plugin for details.
Wowza Video Platform Integration ovp
Allows for integration of videos and live streams you've created in Wowza Video. See Wowza Video Platform Integration plugin for details.

Video source

The source ( root level "src": option) can be configured either as a/an:

  • String
    • If using a self-hosted video, it should be the full URL to the video (example: ). MIME-type is guessed from the suffix. If you have non-standard extensions (like .mov - usage not recommended - or a query parameter for example, you must set the type property. Also, make sure your server sends the correct MIME headers.

      Mime types

      Make sure that all the files are available on the server (avoid redirects) and that the server transmits them with the correct Content-Type header. Depending on your server, you might have to extend the .htaccess or mime.types files (Apache), use the IIS manager (Internet Information Server) or set the header via Metadata (Amazon S3). Example .htaccess file:

      For nginx, the MIME type is defined in nginx/conf/mime.types In lighthttps, use the config file

      In Amazon S3, you need to give the content type as a parameter to the AWS cli or s3cmd when uploading a file, or adapt it in the metadata section of each file when it's already uploaded.

      ## video types
      AddType application/x-mpegurl .m3u8
      AddType video/mp4             .mp4
      AddType video/webm            .webm
      AddType application/dash+xml .mpd
      			hls transport stream segments:
      			AddType video/mp2t            .ts
      			subtitle text tracks:
      			AddType text/vtt              .vtt
  • Object with following properties
    • type - the MIME type (example video/mp4 or application/x-mpegurl )
    • src - the full url of the video (example: )
  • Array of objects to have a fallback mime type for different browsers depending on browser support


    [{ "src": "", "type": "application/x-mpegurl"},
    { "src": "", "type": "video/mp4" }]

If you configure a source array with several source types like m3u8, mp4 and webm, they will be evaluated in the order they're written and the first source the browser supports will be played. This means that you should always list m3u8 first if you want to offer quality selection for example.

Token configuration

Configure the player with your token

You need to configure the player with your token if you haven't already. Your token will be one of the following:

  • If you're playing a video through Wowza Video, use this token:
  • If you're playing a video through something besides Wowza Video, use the unique token sales sent you after you purchased Wowza Flowplayer.

The token is validated online on every player start.

The token has to be configured in the player with the token configuration value.

Initialize player

Create a <div> element in your HTML to act as the placeholder for the player if you haven't:

<div id="player_container"></div>

Then call the flowplayer() initializer to kick of the player if you haven't yet:

flowplayer('#player_container', {
  src: 'my_video.mp4',
  token: '<my_token>'