Video embedding is an act where the viewers place your video on their site. Furthermore the audience on these foreign sites can do the same. The video can spread "like a virus". The terms "viral" and "viral marketing" originate from this concept. In Flowplayer this feature is enabled by default.
How it works?
When end user clicks the embed icon the following HTML code is offered:
This can be pasted on any website's source code and the player will work in place. The embed code has following features:
- The flowplayer is placed inside a
scripttag and upon setup the script tag is replaced by the player
- The setup is minimal without splash screens or custom tweaks.
- The script loads following files: jQuery, flowplayer.js, Google Analytics and flowplayer skin only if they are not present on the embedding page. They are loaded from trusted CDN's and cannot be modified by any party.
- Player dimensions are taken from the video file or if not present the original player dimensions are used
- If Google Analytics is enabled the embedded players will also track to your Analytics account
- Embedded players can be further embedded
How it looks?
Custom logo and returning visitors
In the commercial version you can supply an absolute URL of your logo:
By default this will be displayed on bottom/left corner of the player in the embedded players. When user clicks the logo she will be redirected to the page where the video was originally. Note that the logo is not displayed on your site only on the embedded site. If you want to override this you must force it visible with CSS:
By default the embed feature loads the embed script and Flowplayer assets from our CDN. Since v5.4.1 this can be customized in the embed configuration object if you prefer to host the files yourself. Here is a list of all embed options:
|library||//releases.flowplayer.org/5.5.0/flowplayer.min.js||URL of the Flowplayer API library script|
|script||//embed.flowplayer.org/5.5.0/embed.min.js||URL of the embed script|
|skin||//releases.flowplayer.org/5.5.0/skin/minimalist.css||URL of skin for embedding|
|swf||//releases.flowplayer.org/5.5.0/flowplayer.swf||URL of SWF file for embedding|
The global configuration is a good place to configure embedding because it applies to all players on your page. Example:
Note: The locations must not be paths but full URLs.
This way you can for instance propagate your own customized skin.
Ideally you want to make all required Flowplayer assets available via both the
https: protocols. As with the default locations this can be
achieved by simply omitting the protocol from the URL - as long as the files are
available at that location via both protocols. By contrast, the videos
themselves are better delivered via
http: as the secure protocol affects
playback performance and may cause problems on older Android devices.
You can turn off the embedding feature completely with this boolean shorthand:
Currently Facebook does not support embedding of HTML5 video and thus Flowplayer cannot be directly embedded to Facebook. However you can share your page so that instead of playing the video inline people will come to your site. If direct embedding matters to you a lot we recommend using Flowplayer Flash.
Beware that direct embedding on Facebook is based on Flash and most mobile devices don't have Flash support. Due to enormous growth of mobile users we expect Facebook to look for HTML5 based solutions for embedding in near future.