This page provides the details on how to embed Dailymotion player on an external site. Our iframe based embed player works on many different devices, even ones that doesn’t support Flash. Our player will automatically choose the best technology to use (Flash, HTML5, ...) to provide the best experience for the end user.
Here’s the HTML code you need to embed the Dailymotion Player:
<iframe src="http://www.dailymotion.com/embed/video/VIDEO_ID?PARAMS" width="WIDTH" height="HEIGHT" frameborder="0"></iframe>
We recommand to use our oEmbed API to generate this code.
NOTE: As the VIDEO_ID parameter is optional, you can also initialize DM.player early and define the video to play later, through a call to the load API.
Here is a list of all the parameters that can be used with the Dailymotion Player. They should be added as query-string parameters to the src of the iframe.
|api||Enable the Player API, see API below.|
|autoplay *||Start the playback of the video automatically after the player load (may be restricted, defaults to 0).|
|background||HTML color of the background of controls elements (defaults to FFC300).|
|chromeless||Determines if the player should display controls or not during video playback (defaults to 0).|
|controls||Force the player controls to use either flash or html mode. When html mode is forced, the player may not be able to play the video if the browser doesn’t support HTML5 <video> tag and/or H.264 codec. By default, the best mode is selected regarding user-agent capabilities. This option should used for debug purpose only.|
|foreground||HTML color of the forground of controls elements (defaults to F7FFFD).|
|highlight||HTML color of the controls elements’ highlights (defaults to 171D1B).|
|html||Force the HTML5 mode.|
|id||Id of the player unique to the page to be passed back with all API messages|
|info||Show videos info (title/author) on the start screen (defaults to 1).|
|logo||Allows to hide or show the Dailymotion logo (defaults to 1).|
|network||Hint the player about the host network type. Allowed values are dsl and cellular. The player may use this value to select the correct default stream quality.|
|quality||Determines the quality that must be played by default if available. Valid values are: 240, 380, 480, 720, 1080 (defaults to 380).|
|related||Show related videos at the end of the video. Default value is 1.|
|startscreen||Force the startscreen to use flash or html mode. By default, the html mode is used when UA can render it or flash otherwise.|
|webkit-playsinline||Indicates that a video element should play in-line instead of full-screen. NOTE: this parameter only applies to native apps (defaults to 0).|
* May not work on some mobile OS versions
If you don’t want and can’t use one of our SDK, you can activate the Player API manually by using the api parameter. 3 values are allowed:
- The postMessage value will enable the window.postMessage() based API mode. This is the best way to communicate with the player in an HTML page. Unfortunately, postMessage is a relatively new development, so it’s only available with the following browsers versions: Internet Explorer 8+, Firefox 3+, Safari 4+, Chrome and Opera 9+.
- The fragment value will enable the fragment API mode (experimental). In this mode, you send a method call by changing the fragment of the src of the iframe. The player will use the same technique to send back events.
API methods are simple string with an optional parameter. To call a method, just pass the method name as string using the chosen API mode. To pass an argument, concatenate the method name with the argument by an equal string (ex: seek=10). Methods do never return values. To get the stat of a property, the client has to maintain the updated stat of the properties by listening to events.
|play||Plays the video.|
|pause||Pauses the video.|
|toggle-play||Toggle the play stat of the videos|
|seek||Sees to the specified point in the video (time in seconds).|
|load||Load another video in the player by specifying its id.|
|volume||Changes the volume level of the player to the specified level (between 0 and 1). This call may not be supported on all devices. See Compatibility for more info.|
|muted||Mutes/unmute the player’s volume. Pass 1 to mute the volume or 0 to unmute. This call may not be supported on all devices. See Compatibility for more info.|
|toggle-muted||Toggle mute stat. This call may not be supported on all devices. See Compatibility for more info.|
|fullscreen||Enter/leave fullscreen This call may not be supported on all devices. See Compatibility for more info.|
|watch-on-site||Redirect the user on the Dailymotion page for this video seeked at the same position in the video.|
All events are returnes as a query string starting with event=EVENT_NAME plus some optional data. If you specified an id for this player, the id paramter will be added with the value you specified.
|apiready||Sent when the player is ready to accept API commands. Do not try to call functions before receiving this event.|
|play||Sent when playback starts after a play method returns.|
|playing||Sent when playback starts.|
|pause||Sent when playback pauses after the pause method returns.|
|ended||Sent when playback has stopped at the end of the media resource.|
|canplay||Sent when the player can resume playback of the media data, but estimates that if playback is started now, the media resource could not be rendered at the current playback rate up to its end without having to stop for further buffering of content.|
|canplaythrough||Sent when the player estimates that if playback is started now, the media resource could be rendered at the current playback rate all the way to its end without having to stop for further buffering.|
|timeupdate||Sent when the playback position changes as part of normal playback or because of some other condition. The additionnal time property is sent with this event.|
|progress||Sent when the browser is fetching the media data. The additionnal time property is sent with this event.|
|seeking||Sent when the player is starting to seek to another position in the video.|
|seeked||Sent when the player has completed a seeking operation.|
|volumechange||Sent when the player volume or mute switch is changed. The additionnal volume and muted properties are sent with this event.|
|durationchange||Sent when the duration of the video become available or change during playback. The additionnal duration proprety is sent with this event.|
|fullscreenchange||Sent when the player enter/exit fullscreen. The additionnal fullscreen property is sent with this event.|
|error||Sent when the player occurs an error. The additionnal code, title and message properties are sent with this event.|
* iOS only.
* iOS only.