Player Configuration Guide

Introduction

This article details the configuration settings and features for the Streamable embedded player. These settings determine how the embedded player is rendered and how the configured video is played back by the end-user. 

Here is an example embed code for a Streamable video with tracking enabled:

<iframe src="https://streamable.com/s/ru3ya/iqoguo" width="640" height="360" frameborder="0" allowfullscreen></iframe>

The preferred format for embedding a Streamable video is within a secure iFrame. This way the publisher CMS does not modify or disallow the CSS/Javascript within the video in any way, and ensures bad ads cannot escape the player.



Basic Configuration

Here are the basic settings that are commonly included in an embed code.

  Setting  Type  Description
  shortcode  string  unique ID for video (required)
  embedid  string  unique ID for embed (optional)
  height  integer  height of iFrame in px (optional)
  width  integer  width of iFrame in px (optional)
  mute  boolean  mute video (defaults to false)
  autoplay  boolean  autoplay (defaults to false)


These settings are suitable for most integrations and common CMS platforms. For example, here is a responsive embed code for a Streamable video with autoplay, muting, and tracking enabled:

<div style="width:100%;height:0px;position:relative;padding-bottom:56.250%;"><iframe src="https://streamable.com/s/ru3ya/ibbdzc?autoplay=1&muted=1" frameborder="0" width="100%" height="100%" allowfullscreen style="width:100%;height:100%;position:absolute;left:0px;top:0px;overflow:hidden;"></iframe></div>




Custom Configuration

Here are some advanced settings that can be used for larger publishers and enterprise implementations. In order to use these settings, please contact us.

  Setting  Type  Description
  looping  boolean  loop video (defaults to true)
  branding  string  url of logo or brand img (optional)
  video source  string  url of video src (optional)
  poster source  string  url of thumbnail src (optional)
  source height  integer  height of source video in px
  source width  integer  width of source video in px


With these settings, the player can be used with an existing video infrastructure and CDN offering without utilizing hosting and streaming from Streamable. For example, here is an embed code for an externally hosted video using the Streamable player:

<iframe src="https://streamable.com/customplayer/xnuzaf?src=%2F%2Fcdn-e2.streamable.com%2Fvideo%2Fmp4%2Fhn8hq.mp4%3Ftoken%3D1495816819_1ee05a5e5e8f730d20d57860c6a7d46748026f09&height=720&width=1280&poster=%2F%2Fcdn-e2.streamable.com%2Fimage%2Fhn8hq_first.jpg%3Ftoken%3D1495816819_5c90801217c4e67849189ec90e6ed52b8fe4a0c7" width="1280" height="720" frameborder="0" allowfullscreen></iframe>




Advertising

The following options set the advertising schedule and playback for the Streamable embedded player. If you would like to enable video advertising, please contact us.

  Setting  Type  Description
  type  string  set preroll or postroll ad schedule
  timeout  integer  timeout for ad request in millisec
  skipdelay  integer  time before user can skip in sec
  tag  string  url of VAST/VPAID tag


Using these settings, the Streamable player can be configured to play a wide variety of supported video ads. For example, here is an embed code for a Streamable video with a preroll and a 15-second skip delay player:

<iframe src="https://streamable.com/customplayer/uxmxba?src=%2F%2Fcdn-e2.streamable.com%2Fvideo%2Fmp4%2Fhn8hq.mp4%3Ftoken%3D1495816819_1ee05a5e5e8f730d20d57860c6a7d46748026f09&height=720&width=1280&poster=%2F%2Fcdn-e2.streamable.com%2Fimage%2Fhn8hq_first.jpg%3Ftoken%3D1495816819_5c90801217c4e67849189ec90e6ed52b8fe4a0c7&tag=https%3A%2F%2Fs3.amazonaws.com%2Fstreamable-vast%2Fvast2.xml&type=preroll&skipdelay=15&timeout=2000" width="1280" height="720" frameborder="0" allowfullscreen></iframe>



Please contact us if you have any questions regarding player configuration.

Status Privacy Terms Contact Us