JW Player

Player configuration reference

Review all available web player configuration options.

This article contains all configuration options JW Player supports.

IMPORTANT:

Certain JW Player features may require a specific license. Please contact our team if your license does not support the features or configuration options you need.


Introduction

JW Player contains a number of configurable options. Some options, like width or mute, are top level, while other more advanced options may be nested, such as the ones used for skin customizations and advertising.

Here is an example setup that contains both setup options and specific advertising options:

jwplayer("myElement").setup({
  "playlist": "https://example.com/myVideo.mp4",
  "height": 360,
  "width": 640,
  "autostart": "viewable",
  "advertising": {
    "client": "vast",
    "tag": "http://adserver.com/vastTag.xml"
  }
});


Setup Options

These are the options for configuring the layout and playback behavior of a player. Each is placed directly into the setup of the player.

Appearance

Property Description Default
aspectratio string
                                                                     		 Maintains proportions when width is a percentage. Will not be used if the player is a static size.
Must be entered in ratio "x:y" format.		 -
controls boolean Whether to display the video controls (control bar and display icons) true
displaydescription boolean Configures if the description title of a media file should be displayed true
displayPlaybackLabel 8.6.0+ boolean Enables call-to-action text beneath the play button on the player idle screen.

When set to true, you can potentially see up to a 5% increase in the number of times viewers click the play button to watch a video.

The default call-to-action text is "Play." You can also localize this message for your viewers.		 false
displaytitle boolean Configures if the title of a media file should be displayed true
height number The desired height of your video player (in pixels). Should be omitted when aspectratio is configured 360
qualityLabels array By default, the JW Player will set video quality levels using information from the manifest files. Use this configuration option to apply a custom quality label to a desired bandwidth in kbps, works for HLS and DASH. For example: qualityLabels:{"2500":"High","1000":"Medium"} -
nextUpDisplay boolean Configures whether the Next Up modal is displayed -
renderCaptionsNatively 8.0.1+ boolean (Chrome and Safari only) Determines if the renderer of the browser or of the player is used to display captions

Possible values include:

true: Captions render using the renderer of the browser.

false: Captions render using the renderer of the player.

Note: See also: captions		 false (Chrome)

true (Safari)
stretching string Resize images and video to fit player dimensions. See graphic below for examples
"uniform" — Fits JW Player dimensions while maintaining aspect ratio
"exactfit": Will fit JW Player dimensions without maintaining aspect ratio
"fill"— Will zoom and crop video to fill dimensions, maintaining aspect ratio
"none" — Displays the actual size of the video file. (Black borders)		 uniform
width number | string The desired width of your video player (in pixels or percentage) 640

Stretching Examples

Stretching examples

Stretching examples


Behavior

Property Description Default
aboutlink string Custom URL to link to when clicking the right-click menu https://www.jwplayer.com/learn-more
abouttext string Custom text to display in the right-click menu -
autostart string
                                                                     		 Whether the player will attempt to begin playback automatically when a page is loaded. Set to 'viewable' to have player autostart if 50% is viewable. false
defaultBandwidthEstimate 8.3.0+ number When set, suggests an initial bandwidth estimate (in bits per second) which overrides the default bandwidth estimate of the player for new viewers to your site

Use case: New users to your site may experience low-quality video for several seconds before the quality adapts to the connection speed at which content is delivered. This speed may be limited by their connection speed. In this case, you would want to confirm that the majority of your viewers have fast connections.

NOTE: Since this property sacrifices player performance for video quality, it is strongly recommended not to set this property. The player is optimized to select the best bandwidth after several seconds.		 50000
liveSyncDuration 8.12.0+ number Defines the distance from the live edge in seconds in the following scenarios:

• The player attempts to start a live or DVR stream
• A user clicks the Live button to return to the live content of the stream

This property can accept any value between 5-30.		 25
mute boolean Configures if the player should be muted during playback false
nextupoffset 8.9.0+ number | string Configures when the Next Up card displays during playback

A positive value is an offset from the start of the video. A negative value is an offset from the end of the video. This property can be defined either as a number (-10) or a percentage as a string ("-2%")		 -10
playbackRateControls boolean Whether to display a settings menu to adjust playback speed. If true, the pre-defined options available in the menu are 0.5x, 1x, 1.25x, 1.5x, and 2x. An array can be passed to customize the menu options using playbackRates. Note: This feature is not currently supported in Android with HLS streams. false
playbackRates 8.0+ array of numbers Custom playback rate options to display in the settings menu. [0.25, 0.75, 1, 1.25]
repeat boolean Configures if the player should loop content after a playlist completes false


Media

NOTE

The following properties are related to media that is loaded into the player.

You should use the playlist object to define the content that is loaded into the player.

If you have a single content item to load in a player, you can use the following properties to define this item directly within jwplayer().setup. If you are planning on using multiple media items, these can also be used inside of a playlist array.

Property Description Default
file string
                                                                     		 URL to a single video file, audio file, or live stream to play

Can also be configured inside of a sources array		 -
description string A description of your video or audio item -
image string URL to a poster image to display before playback starts. -
mediaid string Unique identifier of this item. Used by advertising, analytics and discovery services -
title string The title of your video or audio item -
type string Defining the video file type is required when using a media file url that does not have an extension.

Possible values:

• aac
• mp4
• f4a
• f4v
• hls
• m3u
• m4v
• mov
• mp3
• mpeg
• oga
• ogg
• ogv
• vorbis
• webm		 -

YouTube and RTMP media formats are no longer supported.8.0+


Rendering and Loading

Property Description Default
base string Configures an alternate base path for skins and providers /
flashplayer string Specifies an alternate directory of jwplayer.flash.swf /
hlsjsdefault boolean Makes HLSjs the default provider when using Chrome for Android. Disable to use the browser's default provider. true
liveTimeout 8.1.9+ number
                                                                     		 Configures how a stalled live manifest is handled

This property accepts a positive number in seconds, but values between 1-10 are ignored. Set this property to 0 to configure a stream to never time out.

The player will continue requesting manifests until it times out. If a live manifest does not update after being requested for longer than liveTimeout, the stream will end with an error event. If you want a stream to end immediately, include an end tag in the manifest.

This configuration option only handles stalled manifests, not issues with segment loading. A chunk that results in a 404, for example, will still error out.		 30
preload string Tells the player if content should be loaded prior to playback. Useful for faster playback speed or if certain metadata should be loaded prior to playback:

• none: Player will explicitly not preload content. (Recommended if you are concerned about excess content usage.)
• metadata: Loads the manifest and buffers a maximum of one segment of media for HLS and Dash streams.
• auto: Loads the manifest and buffers approximately 30 seconds worth of media segments.		 metadata


Advertising

IMPORTANT

Video ad insertion requires a JW Player Enterprise license. Please contact our team to upgrade your account.

WARNING

Since any changes made to the advertising object override any advertising settings made in the dashboard, be sure to include all existing advertising dashboard configurations within the advertising object.

This object configures the video advertising capabilities of JW Player and overrides advertising settings configured in the dashboard. If no schedule is specified, the ad will play as a preroll by default.

Property Description Client Default
client* string
                                                                     		 (Required) Chooses the ad client that will be used to display advertisements.

Possible values include:

• freewheel: Use the Freewheel client
• googima: Use the Google IMA SDK - Required for certain ad tags
• vast: Use the JW Player VAST client		 All -
outstream* 8.6.0+ boolean (Required for outstream only) Property enabling outstream functionality

NOTE: This must be set to true to enable outstream functionality.		 All -
adscheduleid string (Recommended) Unique identifier for an ad (break) schedule. This ID is located on the ADVANCED tab of the Ad Schedule Detail page. If you do not have ad schedules created via the dashboard, a randomly-generated, eight character, alpha-numeric value can be set. All -
admessage < 8.6.0 string Text that displays during ad playback.

WARNING: Starting with JW Player 8.6.0, use the intl object to set this property.		 All The ad will end in xx seconds
autoplayadsmuted boolean For inline players that start muted when viewed on mobile devices, allows ads to play muted All -
bids object Enable video player bidding with the given settings and bidders. See: advertising.bids IMA -
companiondiv object Gives information to the player related to which div(s) to populate with companion ads. See: advertising.companiondiv IMA, VAST -
conditionaladoptout boolean (VPAID-only) Used to tell the player to not play ads with the conditionalAd attribute inside of the VAST response VAST false
creativeTimeout number In milliseconds, the maximum amount of time between the VAST XML being returned and the adStart event before timing out VAST 15000
cuetext < 8.6.0 string Specify the text that appears when a user mouses over a scheduled advertisement.

WARNING: Starting with JW Player 8.6.0, use the intl object to set this property.		 All Advertisement
displayHeading 8.6.0+ boolean (Outstream only) Controls if heading above the outstream player is displayed<br/ >
Possible values include:

• false: No heading is shown

• true: Heading is shown with default text: Advertisement.

Use intl.{lang}.advertising.displayHeading to customize or localize text.		 All false
endstate 8.6.0+ string (Outstream only) Player behavior after all ads within the ad break have played

Possible values include:

• suspended: A gray background without controls remains.

•close: The player gradually closes.		 All suspended
forceNonLinearFullSlot boolean For forcing nonlinear ads to be fullsot ads rather than overlays IMA -
freewheel object FreeWheel ad client settings.

See: advertising.freewheel		 FreeWheel -
fwassetid string FreeWheel identifier for content configured in FreeWheel MRM FreeWheel -
fwduration number FreeWheel-provided length of the content FreeWheel -
loadVideoTimeout number In milliseconds, the maximum amount of time between the VAST XML being returned and the adstart event before timing out FreeWheel, IMA 15000
locale string Valid two-letter language code for localization of skip-button language IMA -
maxRedirects number The maximum number of redirects the player should follow before timing out IMA 4
placement 8.10.0+ string Value sent in a bid request that identifies the location of a player

This value provides advertisers with more information before bidding for a video ad opportunity.

You can set one fo the following possible values include:

• article
• banner
• feed
• floating
• instream
• interstitial
• slider
 IMA, VAST article when advertising.outstream: true

instream for all other configurations
podmessage < 8.6.0 string Text that displays during playback of an ad pod.

Use __AD_POD_CURRENT__ to denote the currently playing item in the pod and __AD_POD_LENGTH__ for the total number of ads in the pod.

WARNING: Starting with JW Player 8.6.0, use the intl object to set this property.		 VAST Ad xx of yy.
preloadAds boolean Enable pre-loading of prerolls, midrolls and postrolls in click-to-play and autostart: 'viewable'

NOTE: The preroll of subsequent playlist items is also pre-loaded, but only for VAST.		 IMA,
VAST		 false
repeat 8.6.0+ boolean (Outstream only) Controls whether ads play once or continuously

false: After all ads play once, the player enters into an endstate.

true: All ads within the ad break repeat until the viewer or an API call interacts with the player. Unless an ad request fails, the player never enters into an endstate.		 All false
requestTimeout number For VAST, the maximum amount of time, in milliseconds, between the start of the ad break and a returned VAST file before timing out.

For IMA and Freewheel, the maximum amount of time, in milliseconds, between the start of the ad break and the ad impression being fired.		 All 5000 (VAST), 10000 (IMA), 15000 (FW)
rules object Enable ad rules with the given settings and bidders.

See: advertising.rules		 IMA,
VAST		 -
schedule array | string Load an ad schedule from an external JSON block (array) or VAMP XML (string)

See: advertising.schedule		 All -
skipmessage < 8.6.0 string This is used to provide a customized countdown message

WARNING: Starting with JW Player 8.6.0, use the intl object to set this property.		 FreeWheel, VAST Skip ad in xx
skipoffset number If not present in the VAST file, adds a skip offset to static VAST ads FreeWheel,
VAST		 -
skiptext < 8.6.0 string This sets the text of the Skip button after the countdown is over

WARNING: Starting with JW Player 8.6.0, use the intl object to set this property.		 FreeWheel,
VAST		 Skip
tag array | string When a string, URL of the ad tag for VAST and IMA plugins, or a string place holder for FreeWheel

(VAST plugin only) When an array, URLs of the VAST ad tags to be used as fallbacks in the event that one or multiple ad tags fail to render

• (Outstream - Required)

• (VPB - Required) This is used as a fallback tag when using Video Player Bidding.

When a VAST tag is used, ad tag targeting macros can be added to define features such as GDPR consent.

Do not use this property and advertising.vastxml within the same ad break.

advertising.schedule is ignored if this option is set.		 All -
vastLoadTimeout number In milliseconds, the maximum amount of time between the ad request and a returned VAST file before timing out IMA 10000
vastxml string VAST XML ad tag that is requested during the configured ad break

Do not use this property and advertising.tag within the same ad break.

advertising.schedule is ignored if this option is set		 IMA, VAST -
vpaidcontrols boolean For forcing controls to show for VPAID ads

If the VPAID creative has built-in controls, showing the controls may be redundant		 IMA,
VAST		 -
vpaidmode string (IMA VPAID-only)

disabled: VPAID ads will not play and an error will be returned if VPAID is requested

enabled: VPAID is enabled using a cross domain iFrame. The VPAID ad cannot access the site. VPAID ads that depend on friendly iFrame access may not play

insecure: The VPAID ad will load in a friendly iFrame. This allows the ad access to the site via javascript
Not supported in Freewheel		 IMA insecure
withCredentials 8.13.0+ boolean Indicates if Access-Control requests for ad tags are made using credentials such as cookies, authorization headers, or TLS client certificates.

• true: The player requests an ad tag with credentials. If the request fails, the player makes a second request without credentials.

• false: The player makes a single ad request without credentials.		 All true

advertising.bids

Use this property to enable and configure Video Player Bidding with supported bidders.

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4", 
  "advertising": {
    ...
    "bids": {
      "bidOnBreaks": 3,
      "settings": {...},
      "bidders": [...]
    }
  ...
  }
});
Property Description
bidders* array
                                                                     		 (Required) Defines each bidding partner

See: advertising.bids.bidders
settings* object (Required) Defines the mediation layer, floor price, and timeout

See: advertising.bids.settings
bidOnBreaks number Number of ad breaks for which bid requests are sent.

NOTE: For content with more than three ad breaks, change the default setting to 3 and adjust this value depending on performance.

By default, a bid request is made for each ad break.

advertising.bids.bidders[]

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4", 
  "advertising": {
    "bids": {
      ...
      "bidders": [
        {
          "name": "SpotX",
          "id": "85394"
        }
      ]
    }
  ...
  }
});
Property Description
id* string
                                                                     		 (Required) Identifier issued by the bidding partner that represents a segment of a publisher's inventory
name* string (Required) Ad partner from which the bid is received

Possible values include:

• EMX
• Facebook
• PubMatic
• SpotX
• Telaria
optionalParams object Additional parameters that can be appended to the ad tag when SpotX is the the ad partner

See: advertising.bids.bidders[].optionalParams
pubid string Identifier issued by an ad partner that represents the publisher
type string Indicates that the oRTB standard is used by the bidder

NOTE: Required only when name is EMX, Pubmatic, or Telaria. Must be set to OpenRTB.

advertising.bids.bidders[].optionalParams

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4", 
  "advertising": {
    "bids": {
      ...
      "bidders": [
        {
          "name": "SpotX",
          "id": "85395",
          "optionalParams": {
            "price_floor": 5.30,
            "custom": {
              "name": "custom_param_name_goes_here",
              "value": "custom_param_value_goes_here"
            }
          }
        }
      ]
    }
  ...
  }
});
Property Description
content object
                                                                     		 OpenRTB content object. See: 3.2.16 Object: Content in the OpenRTB 2.5 specification.
custom object Publisher-defined custom key-value pairs
price_floor number Price floor of this opportunity
token object Publisher-defined custom pass-through macros

advertising.bids.settings

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4", 
  "advertising": {
    ...
    "bids": {
      ...
      "settings": {
        "mediationLayerAdServer": "jwp",
        "floorPriceCents": 10,
        "floorPriceCurrency": "usd",
        "bidTimeout": 1000  
      }
    }
  ...
  }
});
Property Description
mediationLayerAdServer* string
                                                                     		 (Required) Mediation layer that decides which ad runs

• jwp: (VAST/IMA) An auction is conducted by the player. If a winner is selected, the winner's ad is called. If no winner is selected, the fallback tag is called. You must specify a floor price.

• jwpspotx: (VAST) No auction is conducted by the player. The player asks SpotX for a bid and calls the returned ad response regardless of price. This option is equivalent to using JW Player mediation with a $.01 floor price. You must set up SpotX line items.

• dfp: (IMA) No auction is conducted by the player. All bids are sent to Google Ad Manager (GAM, formerly known as DFP) and rendered as line items that compete against other line items. GAM serves the winning line item. We recommend setting buckets to minimize the number of line items that you must set up in GAM.

• jwpdfp: (IMA) An initial auction is conducted by the player. If a winner is selected, the winner's ad will is called. If no winner is selected, the fallback tag is called to serve. If no winner is selected for any reason, all valid bids are sent to Google Ad Manager (GAM, formerly known as DFP) where the bid values are rendered as line items to compete against other line items. The winning line item is served by GAM. You must set floorPriceCents. We recommend setting buckets to minimize the number of line items that you must set up in GAM.

Default value: jwp
buckets array (Recommended) Ranges of bid prices

When using buckets, bid prices sent to GAM are rounded down to the closest specified increment. Price buckets are helpful to reduce the number of line items in GAM. Without price buckets, one line item per one-cent increment is required.

This property only applies when dfp or jwpdfp (only for the GAM portion of the mediation) is selected as the mediationLayerAdServer.
bidTimeout string Timeout for bid response after the user clicks to play, in milliseconds

If you use SpotX as an ad partner, be sure to make a time allowance for the SpotX SDK to load.

Default value: 2000
floorPriceCents number Price in cents (CPM) that a bid has to beat in order to win

This property must be set when mediationLayerAdServer is set to jwp or jwpdfp.

NOTE: Determining the best floor price depends upon various factors. If you need assistance determining the best floor price, please consult with your JW Player representative or SSP partner.
floorPriceCurrency string Currency of the floorPriceCents

This property must be set to usd when mediationLayerAdServer is set to jwp.

advertising.bids.settings.buckets[]

Property Description Default
increment number
                                                    		 Nearest increment to which a bid is rounded down, in bidding currency 0.01
max number Maximum value of a price bucket, in bidding currency -
min number Minimum value of a price bucket, in bidding currency 0

advertising.companiondiv

This is an object with 3 properties: id, width and height. Set these to have JW Player load a companion ad from your VAST/IMA tag into a div on your page. See Companion Ads for more info.

Property Description
height number
                                           		 The targeted desired height of a companion ad that exists in a VAST ad
id string The ID of the div to replace with a companion ad
width number The targeted desired width of a companion ad that exists in a VAST ad

For an overview of JW Player's advertising capabilities, see its dedicated Video Ads section.

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4",
  "fwassetid": "test_asset",
  "duration": 600,
  "advertising": {
    ...
    "freewheel": {
      "networkid": 12345,
      "adManagerUrl": "https://mssl.fwmrm.net/libs/adm/6.24.0/AdManager.js",
      "serverid": "http://demo.v.fwmrm.net/ad/g/1",
      "profileid": "12345:html5_test",
      "sectionid": "test_site_section"
    }
  }
});

advertising.freewheel

Property Description
adManagerURl string
                                                                     		 URL of the FreeWheel Ad Manager

Your FreeWheel Solution Engineer or Account Representative can provide you with a versioned AdManager URL.
networkid number FreeWheel identifier of a network
profileid string FreeWheel identifier of a particular application environment
sectionid string FreeWheel identifier of a location where the video content plays
serverid string URL of FreeWheel ad server

advertising.rules

Use this property to control how frequently ads play back. See our Ad Rules Reference support article for more information.

jwplayer("myElement").setup({
  "playlist": [...],
  "advertising": {
    ...
    "rules": {
      "startOn": 2,
      "frequency": 1,
      "timeBetweenAds": 300,
      "startOnSeek": "pre",
      "deferAds": {}
    }
  }
});
Property Ad client Description Default
deferAds 8.12.0+ object
                                                                     		 VAST An empty-object setting that prevents ad playback when the player is on an inactive tab

When the player's tab is active again, the last deferred ad break will play. If you want to halt the playback of unviewable ads, configure the autoPause property.

This feature cannot be enabled from your JW Player dashboard.		 -
frequency number IMA,
VAST		 Regularity of ads within a playlist. For example, if frequency: 3, ads play before every third playlist item.

Use 0 to only play ads on the first playlist item.

In the dashboard, this is one of the Ad Frequency Rules.		 1
startOn number IMA,
VAST		 First playlist item allowing ad playback.

In the dashboard, this is one of the Ad Frequency Rules.		 1
startOnSeek 8.5.0+ string VAST Setting that defines if a returning visitor is served a pre-roll ad when resuming previously-watched video content.

pre: Player shows returning visitor a pre-roll ad before resuming video playback.

none: Player shows returning visitor no ads and resumes video playback.

In the dashboard, this is one of the Long-form Engagement Rules.

NOTE: Each of the following must be tracked: the unique viewer, the unique piece of content the viewer was watching, and the time when the viewer left the page during playback of the video content. During the player setup, this information must be passed into the player. Use starttime to pass the time location to resume playback.		 -
timeBetweenAds number VAST Minimum time in seconds that must elapse after displaying an ad in a schedule before playing the next scheduled ad.

In the dashboard, this is one of the Long-form Engagement Rules.		 0

advertising.schedule

Use this property to load an entire advertising schedule to JW Player, containing multiple ad breaks. The property value can be a URL to a VMAP schedule or an inline JSON block with ads. This schedule will then be applied to each playlist item. For scheduling ads for individual playlist items, see scheduling ads for playlist items.

Ad Schedules with VMAP Files

If you are planning on using a VMAP file, add the link to a VMAP .xml file as the value for schedule:

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4",
  "advertising": {
    "client": "vast",
    "adscheduleid": "t4Xk5tsF",
    "schedule": "myvmap.xml"
  }
});

The VMAP schedule will then be applied to each playlist item. See our article about VMAP schedules for more information.

Embedded Ad Schedules with JSON

In order to use a JSON-formatted schedule, you must define at least one ad break configured inside of the schedule property. Each ad break should include an offset and a tag or vastxml.

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/a12bc3D4",
  "advertising": {
    "client": "vast",
    "adscheduleid": "p4Xk5lsZ",
    "schedule": [
      {
        "tag": "myPreroll.xml",
        "offset": "pre",
        "custParams": {
          "testkey1": "testval1",
          "testkey2": "testval2"
        },
      },
      {
        "vastxml": "<VAST version='2.0'> ... </VAST>",
        "offset": "50%"
      }
    ]
  }
});
Property Description Default
custParams object
                                                                     		 Allows for passing custom parameters to an ad break, which then pass through to the URL requested from the ad server -
offset string | number When to play the configured ad tag

pre: Ad plays as a preroll

post: Ad plays as a postroll

xx%: (VAST only) Ad plays after xx% of the content

number: Ad plays after the specified number of seconds		 pre
pod array Configures a single ad break to play two or more VAST ads consecutively

Do not use use this property with advertising.schedule[].tag or advertising.schedule[].vastxml within the same ad break. Instead of using this property, we strongly recommend using a VAST 3.0 template to configure ad pods.		 -
tag string | array When a string, URL of the ad tag for VAST and IMA plugins, or a string place holder for FreeWheel

(VAST plugin only) When an array, URLs of the VAST ad tags to be used as fallbacks in the event that one or multiple ad tags fail to render

When a VAST tag is used, ad tag targeting macros can be added to define features such as GDPR consent.

Do not use this property and advertising.schedule[].vastxml within the same ad break.		 -
type string Property indicating the format of the ad to be served within the ad break

linear: Video ad that interrupts video content playback

nonlinear: Static display ad that overlays a portion of the player and does not interrupt playback. No advertisting cuepoint is shown for this ad break.

If a mix of linear and non-linear ads will serve within an ad break, do not set this property. The player will interrupt video playback for linear ads and will not interrupt video playback for non-linear ads.		 linear
vastxml string VAST XML ad tag that is requested during the configured ad break

Do not use this property and advertising.schedule[].tag within the same ad break.		 -


Auto pause

Automatically pauses the player based on certain rules

By default, adding an empty autoPause object enables the auto pause player functionality and also sets viewability: true.

jwplayer("myElement").setup({
  "playlist": "https://example.com/myVideo.mp4",
  ...
  "autoPause": {
    "viewability": true,
    "pauseAds": true
  }
});
Property Description Default
pauseAds 8.10.0+ boolean
                                                                     		 Controls if ad playback stops when the player is no longer viewable.

• true: When the player is no longer viewable, ad playback pauses. Ad playback resumes when the player becomes viewable again.

• false: Only video playback will be paused when the player is no longer viewable.

NOTE: If viewability: false, setting pauseAds: true will have no effect.		 false
viewability boolean Controls if video playback stops when player is no longer viewable

• true: When the player is no longer viewable, video playback pauses. Playback resumes when the player becomes viewable again. If the player is no longer viewable after an ad break begins, the ad break will continue to play to completion before pausing.

• false: The auto pause functionality is disabled.		 true


Captions

This options block configures the styling of closed captions in the player for desktop browsers. On iOS/Android, a system settings menu provides exactly the same settings, as these are mandated by the FCC.

If you want to control if captions are rendered using the renderer of the browser or the player, set the renderCaptionsNatively property at the global level of setup().

Property Description Default
backgroundColor string
                                                                     		 Hex color of the caption characters background "#000000"
backgroundOpacity number Alpha percentage of the caption characters background 75
color string Hex color of the captions text "#ffffff"
edgeStyle string Method by which the captions characters are separated from their background "none"
fontFamily string Font Family of the captions text "sans"
fontOpacity number Alpha percentage of the captions text 100
fontSize number Size of the captions text (Will not affect text size when rendering captions via browser) 15
windowColor string Hex color of the background of the entire captions area "#000000"
windowOpacity number Alpha percentage of the background of the entire captions area 0

When setting caption styles, color must be specified as a hex value.

See Styling Captions for FCC Compliance for more information.


Casting

Casting enables a viewer to use Google Cast or Apple AirPlay technologies to stream video and audio content to a compatible TV or sound system. By enabling the casting feature for a player, a viewer can tap an icon in the control bar to stream your content on a cast-compatible device. If no compatible device is detected by the player, no cast icon appears.

See also: FAQs

To enable casting, add an empty cast object in your setup.

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/1a2Bc3d4",
  "height": 360,
  "width": 640,
  "cast": {}
});

If you are using a custom receiver, assign the identifier of the custom receiver to the cast.customAppId property.

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/1a2Bc3d4",
  "height": 360,
  "width": 640,
  "cast": {
    "customAppId": "XXXXXX"
  }
});
Property Description
customAppId string
                                                                     		 (Optional) When using a custom receiver, the identifier of the receiver app


DRM

IMPORTANT

Video content protection requires a JW Player Enterprise license. Please contact our team to upgrade your account.

Configuration options related to DRM for MPEG DASH (Playready, Widevine, Clearkey) and HLS streams (Fairplay).

JW Player includes the ability to add DRM to a specific playlist source. Using this method will allow your browser to choose the correct DRM method when multiple DRM types are configured. We highly suggest updating any configurations to use this new method.

NOTE

HTTPS is required for all DRM-protected content.

For more information regarding DRM, and for examples, please view our support article.

drm.playready

Playready DRM is specific to Internet Explorer 11 and Edge on Windows 8.1 or higher operating systems.

Property Description Default
url* string (Required) The URL of the PlayReady license server -
headers array Specifies the custom http headers to send to your playready license server. See headers for more information -
licenseRequestFilter function Expects a function which takes a single request argument. License request filters intercept license requests before 'licenseRequestHeaders' are added. -
licenseResponseFilter function
                                                                     		 Expects a function which takes a single response argument. License response filters intercept license responses before updating the session with the license key. -

drm.widevine

Widevine DRM is specific to Google Chrome on non-iOS devices. Widevine will also function on Firefox browsers for desktop systems.

Property Description Default
url* string (Required) The URL of the WideVine license server -
headers array Specifies the custom http headers to send to your widevine license server requests. See headers for more information -
licenseRequestFilter function Expects a function which takes a single request argument. License request filters intercept license requests before 'licenseRequestHeaders' are added. -
licenseResponseFilter function
                                                                     		 Expects a function which takes a single response argument. License response filters intercept license responses before updating the session with the license key. -
serverCertificateUrl string The URL of the WideVine service certificate -

drm.[widevine/playready].headers

Adding customized HTTP header data to license requests is possible with the "headers" configuration. This replaces the static "customData" configuration option in both widevine and playready scenarios. It is also possible to add multiple custom http headers by including multiple objects in the "headers" array.

DRM can be configured in the following way:

"drm": {
  "playready": {
    "url": "mydrmserver.com",
    "headers": [{
      "name": "customData",
      "value": "hereismycustomdatastring"
    }]
  }
}

In previous versions, adding "customData" would look like the following:

"drm": {
  "playready": {
    "url": "mydrmserver.com",
    "customData": "hereismycustomdatastring"
  }
}
Property Description
name string
                            		 The name of the http header that will be included
value string The value of the http header that will be included

drm.fairplay

JW Player includes configuration options for custom Fairplay integrations. For more information and examples regarding custom Fairplay DRM integrations, please view our support article.

Property Description
certificateUrl* string
                                                                     		 (Required) The path to the certificate which is part of the session data used to initialize the keySession.certificateUrl
processSpcUrl* string | function (Required) The path to the license server (server playback context) which provides the ckc. Expects a direct url to the server. If the url needs to be constructed dynamically, a custom function can be passed to this configuration option which returns the url
extractContentId function Expects a function that receives the initData uri (converted to a string) from the needkey event, and returns the contentId which is part of the session data used to initialize the keySession
extractKey function Expects a function that receives the ckc returned by the license server and returns the key used to update the active key session. If the key can only be extracted asynchronously (for example reading bytes from a ‘blob’ response), this function can return a promise
licenseResponseFilter function Expects a function which takes a single response argument. License response filters intercept license responses before updating the session with the license key.
licenseResponseType string Specifies the data type returned by the XHR request to the license server. The default value is 'arraybuffer'. Other options include 'blob', 'json', and 'text'. This option impacts how “licenseRequestMessage” will be processed
licenseRequestFilter function Expects a function which takes a single request argument. License request filters intercept license requests before 'licenseRequestHeaders' are added.
licenseRequestHeaders array Expects an Array of Objects containing header “name” and “value” properties to be included in the request to the license server
licenseRequestMessage function Expects a function that receives the license key message and returns the message to be sent to the license server. With the default “licenseResponseType” of ArrayBuffer this function passes through keymessage event message property without any changes

drm.clearkey

A basic form of DRM that lists a decryption key inside of your player configuration. This is the least secure form of DRM, though it is the simplest to implement across browsers. There are no additional server resources required to decrypt content with this method. Clearkey is supported in both Chrome and Firefox browsers.

Property Description
key* string
                                      		 (Required) The key required to decrypt DRM content
keyId* string (Required) The key ID specified in the mpd's default_KID value


Float on scroll

Keeps the player visible when the original player location is scrolled out of view by minimizing it to a corner of the screen

On devices in portrait orientation, the player becomes fixed to the top of the page using its original dimensions.

When floating, the viewer can drag the player to reposition it. This functionality is disabled during ad playback.

By default, adding an empty floating object enables the floating player functionality and also sets dismissible: true.

Use the following CSS classes to customize the floating player:

Important

Float on scroll cannot be used with a player that is embedded in an iframe.

jwplayer("myElement").setup({
  "playlist": "https://cdn.jwplayer.com/v2/playlists/{PLAYLIST_ID}",
  ...
  "floating": {
    "dismissible": true
  }
});
Property Description Default
dismissible boolean
                                             		 Permits or prohibits closing the floating player

true: The floating player can be closed by a viewer.

false: The floating player cannot be closed by a viewer.		 true


Google Analytics (ga)

This object configures the built-in integration with Google Analytics.

Property Description Default
label string
                                                                     		 Send another playlist property, like "title" or "mediaid", as your event label in Google Analytics "file"
trackerName 8.9.0+ string When using an analytics.js Google Analytics implementation, the name of a user-generated custom tracker which segments player events that appear in reporting

Custom trackers with gtag.js implementations are not supported.		 -

Google's separate JavaScript library and config needs to be included in your page's head in order to send events with JW Player. Setting an empty "ga":{} options block will enable basic Google Analytics integration. No additional nested config options are required.

See Connecting Google Analytics for more information.


Internationalization

The intl object allows you to add new language translations, customize translations for player text and aria-label values, and access the benefits of the automated player localization feature.

IMPORTANT

Any existing language customizations or translations made outside of the intl object will override both automated player localization and intl object customizations. If you have configured language customizations or translations outside of the intl object, use the table below to copy those values into the corresponding intl.{lang}.{property}.

For each language, use a two-letter or locale-specific language code to define language-specific objects. Use the code example and tables below to configure the intl object.

jwplayer("myElement").setup({
  ...
  "intl": {
    
    // Quebec french sub-block
    "fr-ca": {
      "play": "reproduire"
    },
    
    // french sub-block
    "fr": {
      "replay": "Repeter",
      "play": "jouer"
    },  
  
    // spanish sub-block
    "es": {
      "replay": "Repetir"
    },
  
    // frisian sub-block
    "fy": {
      "advertising": {
        "loadingAd": "Advertinsje lade"
      }
    }
  }
});
Property Description Default
advertising object See: advertising object. -
airplay string Tooltip text and aria-label for Apple AirPlay casting icon in the control bar Airplay
audioTracks string Tooltip text for and aria-label HTML attribute of the audio tracks menu icon Audio Tracks
auto string
                                                                     		 Label text and aria-label HTML attribute of the default quality selection option that allows the player to automatically select the best quality level for the viewer Auto
buffer string aria-label for when player is in buffering state Loading
captionsStyles 8.12.3+ object See captionStyles object -
cast string Tooltip text for and aria-label HTML attribute of the Google Chromecast casting icon in the control bar Chromecast
cc string Tooltip text for and aria-label HTML attribute of the closed captions menu icon Closed Captions
close string Tooltip text for and aria-label HTML attribute of the icon to close a menu or overlay. Close
errors object See: errors object. -
exitFullscreen 8.7.0+ string When in fullscreen mode, tooltip text for and aria-label HTML attribute of the fullscreen icon in the control bar Exit Fullscreen
fullscreen string Tooltip text for and aria-label HTML attribute of the fullscreen icon in the control bar Fullscreen
hd string Tooltip text for and aria-label HTML attribute of the video Quality options menu icon Quality
liveBroadcast string In the control bar, label text and aria-label HTML attribute for live streams Live
logo string aria-label HTML attribute of the logo in the player Logo
mute 8.7.0+ string When the player is not muted, tooltip text for and aria-label HTML attribute of the volume icon in the control bar Mute
next string aria-label HTML attribute of the right arrow in overlays with multiple pages of videos Next
nextUp string Title text and aria-label HTML attribute of the overlay that displays the next item to automatically play in a playlist Next Up
notLive string In the control bar, label text and aria-label HTML attribute that indicates the current video position in a live stream lags behind the real-time stream Not Live
off string Menu option text for turning an option off Off
pause string aria-label HTML attribute of the pause icon in the control bar Pause
play string aria-label HTML attribute of the play icon in the control bar Play
playback string Call-to-action text beneath the play button on the player idle screen. Play
playbackRates string Tooltip text for and aria-label HTML attribute of the playback rate controls menu Playback Rates
player string aria-label HTML attribute of the video player application Video Player
playlist < 8.8.0 string Tooltip text for, overlay heading for, and aria-label HTML attribute of a playlist overlay

Starting with JW Player 8.8.0, use the related.heading property to set this property.		 Playlist
poweredBy string Text displayed before the JW Player name and logo on a button in the Right-click menu. Powered by
prev string aria-label HTML attribute of the left arrow in overlays with multiple pages of videos Previous
related object See: related object. -
replay string Tooltip text for and aria-label HTML attribute of the replay button in the control bar, displayed at the completion of video playback. Replay
rewind string Tooltip text for and aria-label HTML attribute of the rewind button in the control bar Rewind 10 Seconds
settings string Tooltip text for and aria-label HTML attribute of the Settings menu icon Settings
sharing object See: sharing object. -
shortcuts 8.11.0+ object See shortcuts object. -
slider string aria-label HTML attribute of the video scrub bar Seek Slider
stop string aria-label HTML attribute of the stop button in the control bar for live streams. Stop
unmute 8.7.0+ string When the player is muted, tooltip text for and aria-label HTML attribute of the volume icon in the control bar Unmute
videoInfo string Label text and aria-label HTML attribute of the Right-click menu button. About This Video
volume string Tooltip text for and aria-label HTML attribute of the volume in the control bar. Volume
volumeSlider string aria-label HTML attribute of the volume slider in the control bar. Volume Slider


intl.{lang}.advertising object

This object localizes the player text and ARIA labels of the advertising object.

Property Description Default
admessage string Countdown message text that displays the remaining duration of an ad This ad will end in xx
cuetext string
                                                                     		 Tooltip text for and aria-label HTML attribute that indicates the content is an advertisement. Appears when a user mouses over a scheduled advertisement cue marker in the time slider. Advertisement
loadingAd string Text displayed when an ad is loading Loading ad
podmessage string Text that displays during playback of an ad pod.

Use __AD_POD_CURRENT__ to denote the currently playing item in the pod and __AD_POD_LENGTH__ for the total number of ads in the pod.		 Ad xx of yy
skipmessage string Skip countdown message text that displays the remaining duration before an ad can be skipped Skip ad in xx
skiptext string Button text for and aria-label HTML attribute that indicates when an ad can be skipped Skip


intl.{lang}.captionsStyles object

This object localizes the captions styling menu displayed in the player.

Property Description Default
backgroundColor string
                                                                     		 Name of submenu to control the background color of subtitles Background Color
backgroundOpacity string Name of submenu to control the backround transparency of subtitles Background Opacity
black string Name of color option Black
blue string Name of color option Blue
characterEdge string Name of submenu to control the text decoration of subtitles Character Edge
cyan string Name of color option Cyan
depressed string Label for a captions style decoration where the text appears depressed or engraved Depressed
disabled string Label to disable a feature Disabled
dropShadow string Label for a captions style decoration where the text has a shadow Drop Shadow
enabled string Label to enable a feature Enabled
fontColor string Name of submenu to control the font color of subtitles Font Color
fontFamily string Name of submenu to control the font of subtitles Font Family
fontOpacity string Name of submenu to control the transparency of subtitles Font Opacity
fontSize string Name of submenu to control the size of subtitles Font Size
green string Name of color option Green
magenta string Name of color option Magenta
none string Label of a menu item to not select any option (similar to the concept of "off") None
raised string Label for a captions style decoration where the text appears raised or embossed Raised
red string Name of color option Red
reset string Label to reset options to their defaults Reset
subtitleSettings string Heading for the menu where you can change subtitles styles Subtitle Settings
uniform string Label for a captions style decoration where the text appears outlined Uniform
white string Name of color option White
windowColor string Name of submenu to control the window color of subtitles Window Color
windowOpacity string Name of submenu to control the transparency of the subtitle window Window Opacity
yellow string Name of color option Yellow


intl.{lang}.errors object

This object localizes the error messages displayed in the player.

Property Description Default
badConnection string
                                                                     		 Error message text displayed when a connection issue prevents playback This video cannot be played because of a problem with your internet connection.
cantLoadPlayer string Error message text displayed when a player fails to instantiate due to a non-network reason. For example: incorrect JSON or license keys Sorry, the video player failed to load.
cantPlayInBrowser string Error message text displayed when a video fails to start playback due to a browser support reason. For example: such as Flash or DASH error or browser support The video cannot be played in this browser.
cantPlayVideo string Error message text displayed when a media item fails to load This video file cannot be played.
errorCode string Label text for a numeric error code. (For example: Error code: 50244402) Error code
liveStreamDown string Error message text displayed when a live stream has technical issues or has ended The live stream is either down or has ended.
protectedContent string Error message text displayed when DRM or protected content fails There was a problem providing access to protected content.
technicalError string Fallback error message text displayed when no other error message is applicable This video cannot be played because of a technical error.



intl.{lang}.related object

This object localizes the player text and ARIA labels of the related object.

Property Description Default
autoplaymessage string
                                                                     		 Countdown message text that displays the remaining duration before the next video begins to play Next up in xx
heading string Button text for, overlay heading for, and aria-label HTML attribute of recommended video interfaces More Videos


intl.{lang}.sharing object

This object localizes the player text and ARIA labels of the sharing object.

Property Description Default
copied string
                                                                     		 In the Sharing menu, tooltip text and aria-label HTML attribute for when a link is copied to the clipboard Copied
email string In the Sharing menu, label text for and aria-label HTML attribute of the option to email a video link in the sharing menu Email
embed string In the Sharing menu, label text for and aria-label HTML attribute of the option to copy embed code to clipboard Embed
heading string Tooltip text for and aria-label HTML attribute of the Sharing button in the control bar Share
link string In the Sharing menu, label text for and aria-label HTML attribute of the option to copy a link to clipboard Link


intl.{lang}.shortcuts object

This object localizes the keyboard shortcut menu items.

Property Description Default
captionsToggle string
                                                                     		 Description of the keyboard shortcut behavior to toggle captions in the video Captions On/Off
decreaseVolume string Description of the keyboard shortcut behavior to decrease the volume of the video Decrease Volume
fullscreenToggle string Description of the keyboard shortcut behavior to toggle fullscreen Fullscreen/Exit Fullscreen
increaseVolume string Description of the keyboard shortcut behavior to increase the volume of the video Increase Volume
keyboardShortcuts string Heading for a list of all of the available keyboard shortcuts in the video player Keyboard Shortcuts
playPause string Description of the keyboard shortcut behavior to toggle playback Play/Pause
seekBackward string Description of the keyboard shortcut behavior to seek backward by 5 seconds in the video Seek Backward
seekForward string Description of the keyboard shortcut behavior to seek forward 5 seconds of the video Seek Forward
seekPercent string Description of the keyboard shortcut behavior to fast forward to a certain point in a video in a multiple of ten

For example, you can press the 5 key to go to the 50% mark of the video. 2 key for 20% of the video.		 Seek %
spacebar string Name of the spacebar key on a keyboard SPACE
volumeToggle string Description of the keyboard shortcut behavior to toggle the volume. Mute/Unmute


Transition table

Use the table below to copy old customization or translation values to the corresponding intl.{lang}.{property}.

Old property New property
advertising.admessage intl.{lang}.advertising.admessage
advertising.cuetext intl.{lang}.advertising.cuetext
advertising.podmessage intl.{lang}.advertising.podmessage
advertising.skipmessage intl.{lang}.advertising.skipmessage
advertising.skiptext intl.{lang}.advertising.skiptext
localization.airplay intl.{lang}.airplay
localization.audioTracks intl.{lang}.audioTracks
localization.buffer intl.{lang}.buffer
localization.cast intl.{lang}.cast
localization.cc intl.{lang}.cc
localization.close intl.{lang}.close
localization.copied 8.1.8+ intl.{lang}.sharing.copied
localization.errors.badConnection8.4.0+ intl.{lang}.errors.badConnection
localization.errors.cantLoadPlayer 8.4.0+ intl.{lang}.errors.cantLoadPlayer
localization.errors.cantPlayInBrowser 8.4.0+ intl.{lang}.errors.cantPlayInBrowser
localization.errors.cantPlayVideo 8.4.0+ intl.{lang}.errors.cantPlayVideo
localization.errors.errorCode 8.4.0+ intl.{lang}.errors.errorCode
localization.errors.liveStreamDown 8.4.0+ intl.{lang}.errors.liveStreamDown
localization.errors.protectedContent 8.4.0+ intl.{lang}.errors.protectedContent
localization.errors.technicalError 8.4.0+ intl.{lang}.errors.technicalError
localization.fullscreen intl.{lang}.fullscreen
localization.hd intl.{lang}.hd
localization.liveBroadcast intl.{lang}.liveBroadcast
localization.loadingAd intl.{lang}.advertising.loadingAd
localization.more intl.{lang}.next
localization.next intl.{lang}.next
localization.nextUp intl.{lang}.nextUp
localization.nextUpClose intl.{lang}.close
localization.pause intl.{lang}.pause
localization.play intl.{lang}.play
localization.playback intl.{lang}.playback
localization.playbackRates intl.{lang}.playbackRates
localization.player intl.{lang}.player
localization.playlist intl.{lang}.playlist
localization.prev intl.{lang}.prev
localization.related intl.{lang}.related.heading
localization.replay intl.{lang}.replay
localization.rewind intl.{lang}.rewind
localization.stop intl.{lang}.stop
localization.videoInfo intl.{lang}.videoInfo
localization.volume intl.{lang}.volume
related.autoplaymessage intl.{lang}.related.autoplaymessage
sharing.heading intl.{lang}.sharing.heading
sharing.link intl.{lang}.sharing.link


Logo

This options block configures a clickable watermark that is overlayed on the video.

Property Description Default
file string
                                                                     		 The URL of an external JPG, PNG or GIF image to be used as watermark (e.g. /assets/logo.png). We recommend using 24 bit PNG images with transparency -
hide boolean When this option is set to true, the logo will automatically show and hide along with the other player controls false
link string The URL to visit when the watermark image is clicked. Clicking a logo will have no affect unless this is configured -
margin number The distance, in pixels, of the logo from the edges of the display 8
position 8.0+ string This sets the corner in which to display the watermark. "control-bar" adds the logo as the leftmost icon in the right grouping of buttons in the control bar.

"top-left"
"top-right"
"bottom-left"
"bottom-right"
"control-bar"		 "top-right"

Example

jwplayer("myElement").setup({
  "file": "http://example.com/myVideo.mp4",
  "logo": {
    "file": "/assets/jw-logo-red-46px.png",
    "link": "https://www.jwplayer.com",
    "hide": "true",
    "position": "top-left"
  }
});

NOTE

We highly recommend using low-resolution images for logos in the player, as Internet Explorer may not resize an image, especially if it is high-resolution.


Playlists

The playlist is a powerful feature of JW Player, used to play multiple video or audio files.

A playlist can be either a string, referring to the URL of an RSS feed or JSON file, or an array of media objects.

Configuring Playlist as a String

jwplayer("myElement").setup({
  "playlist": "http://example.com/myPlaylist.json"
});

playlist[]

Configuring Playlist as an Array

jwplayer("myElement").setup({
  "playlist": [{
      "file": "/assets/sintel.mp4",
      "image": "/assets/sintel.jpg",
      "title": "Sintel Trailer",
      "mediaid": "ddra573"
    },{
      "file": "/assets/bigbuckbunny.mp4",
      "image": "/assets/bigbuckbunny.jpg",
      "title": "Big Buck Bunny Trailer",
      "mediaid": "ddrx3v2"
  }]
});
Property Description
file* string
                                                                     		 (Required) If no file is specified in your setup or sources, this is a required configuration option
adschedule object Schedule advertising for a specific media file

See: playlist.adschedule
description string Short description of the item. It is displayed below the title. This can be hidden with the displaydescription option.
image string Poster image URL. Displayed before and after playback.
mediaid string Unique identifier of this item. Used by advertising, analytics and discovery services
minDvrWindow number HLS-only In seconds, the minimum amount of content in an M3U8 required to trigger DVR mode. Set to 0 to always display DVR mode.(Defaults to 120)
recommendations string URL to a feed that contains related items for a particular playlist item
sources array Used for quality toggling and alternate sources

See: playlist.sources
starttime number Time in seconds to start a media item.

NOTE: When used with an MP4 video file, both seek and seeked events are triggered. Neither event is triggered when used with a DASH or HLS stream.
title string Title of the item. This is displayed inside of the player prior to playback, as well as in the visual playlist. This can be hidden with the displaytitle option
tracks array Include captions, chapters, and thumbnails for media

See: playlist.tracks
withCredentials boolean If true, "withCredentials" will be used to request a media file rather than CORS

In addition to standard media information, (title, description, mediaid) it is also possible to insert additional metadata, using custom properties. This information must be entered inside of a playlist, and cannot be set directly inside of a setup block.

playlist[].adschedule[]

IMPORTANT:

Video ad insertion requires a JW Player Enterprise license. Please contact our team to upgrade your account.

The playlist[].adschedule[] property is used for scheduling ad breaks throughout specific playlist items. You must define at least one ad break configured inside of the adschedule property. Each ad break should include an offset and a tag or vastxml.

Property Description
offset string OR number
                                                                     		 (Required) When to play the configured ad tag

• pre: Ad plays as a preroll

• post: Ad plays as a postroll

• xx%: (VAST only) Ad plays after xx% of the content

• number: Ad plays after the specified number of seconds
tag string (Required) When a string, URL of the ad tag for VAST and IMA plugins, or a string place holder for FreeWheel

(VAST plugin only) When an array, URLs of the VAST ad tags to be used as fallbacks in the event that one or multiple ad tags fail to render

When a VAST tag is used, ad tag targeting macros can be added to define features such as GDPR consent.

Do not use this property and playlist[].adschedule[].vastxml within the same ad break.
type string Property indicating the format of the ad to be served within the ad break

• linear: Video ad that interrupts video content playback

• nonlinear: Static display ad that overlays a portion of the player and does not interrupt playback. No advertisting cuepoint is shown for this ad break.

If a mix of linear and non-linear ads will serve within an ad break, do not set this property. The player will interrupt video playback for linear ads and will not interrupt video playback for non-linear ads.
vastxml string VAST XML ad tag that is requested during the configured ad break

Do not use this property and advertising.schedule[].tag within the same ad break.		 
jwplayer("myElement").setup({
  "playlist": [{
      "title": "One Media Item",
      "description": "Only One media item in a playlist!",
      "file": "myFile.mp4",
      "mediaid": "ddrx3v2",
      "image": "myImage.png",
      "adschedule": [{
          "offset": "pre",
          "tag": "myAdTag.xml"
        },
        {
          "offset": 10,
          "tag": "myMidroll.xml"
      }]
  }]
});

playlist[].sources[]

Sources are inserted into playlist objects and are lists of files. Sources serve a dual purpose, depending on the files used:

  • Use different file types: Alternate "fallback" media sources
  • Use the same file type: Toggle quality with static video files

Alternate Media Sources

If using different file types, sources prioritizes which file to play only in the case when a provider (HTML5, HLS, or DASH) fails to load. If there is an error with a stream, the player will not failover to the next provider. In the example below, the player will attempt to play myVideo.m3u8 as a first choice.

In the event that a browser cannot play an m3u8, the player is intelligent enough to choose myVideo.mp4 instead. In the event that an mp4 cannot be played, the player will attempt the webm format before producing an error.

jwplayer("myElement").setup({
  "playlist": [{
    "title": "One Playlist Item With Multiple Sources",
    "description": "Three Sources - One Playlist Item",
    "image": "myImage.png",
    "mediaid": "ddrx3v2",
    "sources": [{
        "file": "myVideo.m3u8"
      },{
        "file": "myVideo.mp4"
      },{
        "file": "myVideo.webm"
    }]
  }]
});

Sources with DRM

When using DRM, we highly suggest placing the drm block inside of the appropriate media source. This ensures the correct media and DRM pair gets chosen for the appropriate browser. For example:

  "sources": [{
      "file": "myFairplayStream.m3u8",
      "drm": {
        "fairplay": {
          "certificateUrl": "http://myfairplay.com/fairplay/cert",
          "processSpcUrl": "http://myfairplay.com/fairplay/ckc"
        }
      }
    },{
      "file": "myWidevineStream.mpd",
      "drm": {
        "widevine": {
          "url": "http://mywidevineurl.com/drm"
          }
      }
    },{
      "file": "myPlayreadyStream.mpd",
      "drm": {
        "playready": {
          "url": "http://myplayreadyurl.com/drm"
          }
      },{
      "file": "myClearkeyStream.mpd",
      "drm": {
        "clearkey": {
          "key": "1234clear5678key",
          "keyId": "fefde00d-efde-adbf-eff1-baadf01dd11d"
          }
      }
    }]

See our drm section for more information.

Manifest and Segment Requests with Custom Headers

You can add custom headers to media XHR requests by using the onXhrOpen callback. This gets executed after XMLHTTPRequest.open() and before XMLHTTPRequest.send() for HLS manifest, key and segment requests made by the player. This is not available in Safari browsers where HLS is played natively.

jwplayer().setup({
  playlist: [{
      sources: [{
          file: 'video.m3u8',
          onXhrOpen: function(xhr, url) {
            xhr.setRequestHeader('customHeader', 'customHeaderValue');
          }
      }]
  }]
})

For HLSjs playback only.

Quality Settings for Video Files

In the event that a streaming technology like HLS or DASH cannot be used, listing video files of different qualities will enable a quality selection settings menu in the player. Compared to other streaming methods, it has the following drawbacks:

  • No automatic switching, based on bandwidth or download speed
  • Changing qualities may cause playback stuttering
  • Pseudostreaming may need to be configured in cases where Flash is used
jwplayer("myElement").setup({
  playlist: [{
      title: "One Playlist Item With Multiple Qualities",
      description: "Two Qualities - One Playlist Item",
      sources: [{
          file: "myVideo-720p.mp4",
          label: "HD"
        },{
          file: "myVideo-480p.mp4",
          label: "SD"
      }]
  }]
});
Property Description
file string
                                                                     		 (Required) URL to the video file, audio file, YouTube video or live stream of this playlist item source.
default boolean Set this to true for the media source you want to play on startup. If this isn't set for any source, the first one is used
drm object An object containing DRM information for a particular source
label string Label of the media source, displayed in the manual quality selection menu. Set this if you have more than 2 qualities of your video.
type string Forces a media type. Only required when a file extension is missing or not recognized (Using .php or certain tokens, for example)

playlist[].tracks[]

Tracks can be attached to media for three possible reasons: captions, thumbnails, or chapters. Thumbnail and chapter files must be in WEBVTT format. Captions accept WEBVTT, SRT, and DFXP format, though JW Player strongly suggests using WEBVTT if possible.

Property Description Default
default boolean
                                                                     		 Only for captions. Set this to true if you want a captions track to display by default -
file string URL to the captions, chapters or thumbnails text track file. See Adding Closed Captions for an example setup. -
kind string The kind of text track.
"captions": Captions that display during video playback.

"chapters": Places markers on the video er, displaying different sections
"thumbnails": A list of thumbnails that appear when the mouse cursor hovers on the timeslider.		 "captions"
label string Label of the text track. Is only used in setups with multiple captions, where the label is displayed in the CC selection menu. index

When using the playlist to load an RSS feed, these options are set in the feed. See the Media Formats Reference for a mapping of all playlist options to RSS format.

360 videos

IMPORTANT:

360/VR videos require a playlist block in order to work, even for single items. They will not work at the global level using "file." Playlists can contain a mix of 360 and non-360 items.

Playlist configuration options described above can be used with spherical videos. Below are 360-specific options.

Property Description Default
stereomode string
                                                                     		 (Required) This field is required for each 360 item in a playlist. If it is undefined, the video will not render in 360 mode. Supported values are "monoscopic", "stereoscopicTopBottom", and "stereoscopicLeftRight". -


Related

This object controls the playlist appearance and behaviors.

Property Description Default
autoplaymessage < 8.6.0 string
                                                                     		 A custom message that appears during autoplay.

xx will be replaced by the countdown timer
__title__ will be replaced by the next title in the related feed.

WARNING: Starting with JW Player 8.6.0, use the intl object to set this property.		 "__title__ will play in xx seconds"
autoplaytimer number The number of seconds to wait before playing the next related video in your content list. Set to 0 to have your next related content to play immediately 10
displayMode 8.1.9+ string Configures the playlist user interface

• none8.9.0+: With the exception of the next up button in the control bar, removes all aspects of the playlist interface

Set this value when using a custom external playlist user interface.


• overlay: Adds a "more videos" icon to the control bar

When clicked, an overlay takes over the player and pauses playback.


• shelf: Adds a horizontal bar of thumbnails above the control bar that allows viewers to browse recommended videos during the playback experience

The shelf can be collapsed into a "More Videos" button, which appears above the control bar. Due to size constraints, small players fall back to "overlay" mode.


• shelfWidget8.5.0+: Adds a persistent horizontal bar of thumbnails outside and beneath the player that allows viewers to browse recommended videos during the playback experience

Use selector to configure shelf location.		 overlay (manual, dynamic, and trending playlists)

shelf (recommendations playlists)
file string Location of a JSON or RSS file that contains a recommendations playlist

Use this property to associate a recommendations playlist with all playlists in a player. To associate a recommendations playlist with a specific playlist or playlist item, use playlist[].recommendations.		 -
onclick string Behavior when a related video is selected

play: Plays the next video within the current player.

link: Redirects the page to the url specified in the related item's link field.		 play
oncomplete string Behavior of the related videos overlay when a single video or playlist is completed

autoplay: Displays the related overlay and automatically plays the next video in your related feed after 10 seconds

This option also automatically sets the onclick behavior to play.

hide: Replay button and related icon will appear

none: No overlay appears and player automatically advances to the next playlist item

If there is no media item to advance to, the replay button appears.

show: Display the related overlay		 none 8.9.0+

show < 8.9.0 (excluding 8.9.0)
selector 8.6.0+ string CSS selector that points to an HTML element that is used as the container when displayMode is set to shelfWidget.

This property can be configured in the following ways:

Undefined HTML element and selector: An element with id="{playerID}-shelf-widget" is created. By default, the shelf widget displays in <div id="{playerID}-shelf-widget"> directly below the player. The shelf widget size is responsive to the player.

You can also assign this ID to a different HTML element on your page. This allows you to set the widget location without defining a new selector. If you assign this ID to a different HTML element, the shelf widget size is responsive to the HTML element.

Defined HTML element and selector: If the HTML element has an ID (myDefinedID) and "selector": "#myDefinedID", shelf widget is placed inside the of HTML element with id="myDefinedId". The shelf widget size is responsive to the HTML element.		 -


Sharing

This options block controls a settings submenu with social sharing options: copy embed code, copy video link and share video to social networks.

Setting an empty "sharing":{} options block will enable the social sharing menu and icon in the control bar. Without the nested config options, it will show the page URL link with default sharing sites, but no embed code.

Property Description Default
link string
                                                                     		 URL to display in the video link field URL of the current page
code string Embed code to display in the embed code field

If no code is set, the field is not shown.		 -
heading < 8.6.0 string Short, instructive text to display at the top of the sharing screen

WARNING: Starting with JW Player 8.6.0, use intl.{lang}.sharing.heading.		 "Share Video"
sites array Allows for the customization of social icons ["facebook", "twitter", "email"]

Available Built-In Social Networks

Social Network Configuration Value Social Network Configuration Value
Facebook "facebook" Tumblr "tumblr"
Twitter "twitter" LinkedIn "linkedin"
Pinterest "interest" Reddit "reddit"
Email "email"

Example

jwplayer("myElement").setup({
  file: "http://example.com/myVideo.mp4",
  sharing: {
    sites: ["reddit","facebook","twitter"]
  }
});

See our Social Sharing support article for more information.


Skin

JW8 comes with 11 new skin configuration options out of the box. With such granular control over brand identity, it’s easier than ever to customize the player.

Color Customization

Color can be specified as a hex value, RGBA color value, or color name.8.0+

Config Type Description Default
skin.controlbar.text String The color of any plain text in the control bar, such as the time. "#FFFFFF"
skin.controlbar.icons String The default, inactive color of all icons in the control bar. This option also controls the color of the play, pause, and replay icons in the inactive and complete states. "rgba(255,255,255,0.8)"
skin.controlbar.iconsActive String The color of hovered or selected icons in the control bar. "#FFFFFF"
skin.controlbar.background String TThe background color of the control bar and the volume slider. The default background is transparent. "rgba(0,0,0,0)"
skin.timeslider.progress String The color of the bar in the time slider filled in from the beginning of the video through the current position. The buffer region of the control bar is 50% of the opacity of this color. The color of the volume slider is also controlled by this option. "#F2F2F2"
skin.timeslider.rail String The color of the base of the timeslider, known as the rail. "rgba(255,255,255,0.3)"
skin.menus.text String The color of inactive, default text in menus and the Next Up overlay. "rgba(255,255,255,0.8)"
skin.menus.textActive String The color of hovered or selected text in menus. This option also controls the text color in the Discover overlay and the hover state text color in the Next Up overlay. "#FFFFFF"
skin.menus.background String The background color of menus and the Next Up overlay. "#333333"
skin.tooltips.text String The text color of tooltips. "#000000"
skin.tooltips.background String The background color of tooltips. "#FFFFFF"

Backward Compatability

JW8 continues to support the three color customization options from 7.x, skin.active, skin.inactive, skin.background, though the colors may map slightly differently in the new major version.

The table below shows how the three JW7 customization options map to the new JW8 options. You can use both JW7 and JW8 options in an 8 player, with the more specific JW8 configurations overriding JW7 ones when both apply to the same element. Note that there’s no JW7 mapping to the new skin.timeslider.rail option.

New JW8 Config skin.active skin.inactive skin.background
skin.controlbar.iconsActive X
skin.timeslider.progress X
skin.menus.textActive X
skin.controlbar.text X
skin.controlbar.icons X
skin.menus.text X
skin.tooltips.text X
skin.tooltips.background X
skin.controlbar.background X
skin.menus.background X
skin.timeslider.rail does not map

Custom Skins

For more information regarding custom skins, see our Branding documentation.

Config Type Description Default
skin.url String If using an external CSS file to style your player, this must be specified here. -
skin.name String The name of your custom skin to use for styling the player. If you are specifying skin.url, you must specify skin.name, which must match the class name in your CSS file. -

Updated 7 days ago

Player configuration reference

Review all available web player configuration options.

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.