To enjoy all our Developer Portal features, please switch to Microsoft Edge, Google Chrome or Mozilla Firefox browsers.

Video player documentation

Embed the player

Overview

The Dailymotion Player is a state-of-the-art video player built with the latest web technologies (HTML5/ JavaScript) and video standards (HLS adaptive streaming).

It's easy to use, cross-platform and enjoyed by millions of users every day, both on Dailymotion's properties and hundreds of premium Partners' websites and native applications.

The Dailymotion Player is fully customizable, consistent on all devices and delivered with picture-in-picture, analytics and advertising solutions out of the box.

To get the full feature list please visit our dedicated page or try the live player demo in our player playground.

Integration methods

Depending on your needs, you can either embed the player using an iframe, or use our dedicated Web or Mobile SDKs for complete control of the user experience.

iFrame

The iframe embed method is the fastest way to integrate the Dailymotion Player on your website. Dailymotion delivers the HTML5 player via an iframe to ease the integration for most common use cases, while supporting all the costs for the video encoding, streaming, storage and support.

How to use

  1. Retrieve the iframe:

    • If you are Partner you can log in to the Partner HQ website, choose the video from the Media section, and select the "share" option to copy the code.
    • Otherwise, on dailymotion.com, navigate to the video page with the video you want to embed, click the share button and then copy the provided embed code.
    • Or call our Data API with the video ID and get the code in the JSON response.
    GET https://api.dailymotion.com/video/x7tgad0?fields=embed_html
    
    RESPONSE{
        "embed_html": "<iframe frameborder=\\"0\\" width=\\"640\\" height=\\"360\\" src=\\"<https://www.dailymotion.com/embed/video/x7tgad0\\>"; allowfullscreen allow=\\"autoplay\\"></iframe>"
    }
    
  2. Paste the iframe code snippet on your site, exactly where you want the player to be displayed.

    <iframe frameborder="0" width="640" height="360" 
        src="https://www.dailymotion.com/embed/video/x7tgad0" 
        allowfullscreen 
        allow="autoplay; fullscreen">
    </iframe>
    

Best practices

Use player params correctly:
To customize the player in the iframe, add a ? character directly after the video ID in the src attribute of the iframe,then add any of the available parameters. To use multiple parameters at once, separate each parameter with an &.
Please find the full list of available parameters here.

<iframe frameborder="0" width="640" height="360"
    src="https://www.dailymotion.com/embed/video/x7tgad0?autoplay=1&ui-highlight=fff"
    allowfullscreen
    allow="autoplay; fullscreen">
</iframe>

Preserve aspect ratio:
The Dailymotion Player is fully responsive, but by default, iFrames themselves are not. To ensure the player preserves its aspect ratio across all devices and screen sizes, we use specific styles and put the iframe inside a div. partners can choose between a standard or responsive player embed in their Partner HQ via the media sharing window.

<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;">
    <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;overflow:hidden"
    frameborder="0" type="text/html" 
    src="https://www.dailymotion.com/embed/video/x7tgad0?autoplay=1" 
    width="100%" height="100%"   
    allow="autoplay" allowfullscreen>
    </iframe>
</div>

Web SDK (JavaScript)

The Web SDK provides access to the Player API for full control of the player on your website or applications. It's even possible to remove the default controls and develop your own, for a completely custom look and feel.

When to use

The Web SDK is recommended when you need advanced customization, specific behaviour based on user interactions, or direct access to player events.

How to use (3 steps)

  1. Add the Dailymotion SDK library to your HTML page.

    <script src="https://api.dmcdn.net/all.js"></script>
    
  2. Add a placeholder div with an ID attribute on the page where you want the player to be injected.

    <body>
        <div id="player"></div>
    </body>
    
  3. Use the DM.player() method to create a player instance. The SDK will take care of generating and injecting an iframe into the placeholder div.

    var player = DM.player(document.getElementById("player"),{ 
        video: "x7tgad0", 
        width: "100%", 
        height: "100%", 
        params: { 
            autoplay: true, 
            mute: true 
        } 
    }); 
    

You now have full access to the Player API including all events, properties and methods. Check out our Player API Reference here.

Best practices

Player Ready:
You should wait for the apiready event before calling any API method. The player can only execute API commands once this event has been triggered.

player.addEventListener('apiready', function(){
  console.log('Player API ready');
});

Destroy method:
There may be situations where you want to remove the player iframe from the page (e.g. single page applications). Pass the player div ID to the destroy method.

player.destroy('player');

Correctly use player params:
To customize the player with the Web SDK, add any available parameters to the params object in your player variable. Please find the full list of available parameters here.

var player = DM.player(document.getElementById("player"),{ 
    video: "x7tgad0",
    width: "100%",
    height: "100%",
    params: {
        "autoplay": true,
        "mute": true,
        "ui-highlight": "fff",
        "logo" : true
    } 
});

Mobile SDKs

We provide our publishers with the same tools we use to create our flagship Dailymotion applications: the same Player and the same SDKs. Check out our apps in the Apple App Store or Google Play Store which have over 50M+ downloads.

Our Mobile SDK provides access to the Player API and gives you full control of the player. Along with having a genuine native feel, it's possible to use our provided tools, to build a unique video solution in your app, benefiting from your own custom UI components and aligning it with the look and feel of your brand.

As our SDKs are open source, partners can make a pull request to update the iOS or Android SDK. Please check the source code, documentation and sample app on GitHub.

Android SDK

When to use

The SDK is a thin wrapper around a WebView that allows to easily embed Dailymotion videos into your Android application. We recommend using the SDK rather than the video URL in a standard webView, as it gives you more controls of the player and its better for tracking purposes. Our Android SDK is open source and you can get all the required information plus a sample app on our GitHub. The SDK supports Android 5.0.x (API level 21+) and It is fully in Kotlin, If your project is still in JAVA, please add the kotlin dependencies: https://developer.android.com/kotlin/add-kotlin.

How to use (3 steps)

  1. The easiest way to integrate the SDK is by adding it to your application build.gradle file. Please note the SDK requires the minSdkVersion of the app to be 21+.

    implementation 'com.dailymotion.dailymotion-sdk-android:sdk:0.2.2'
    
  2. The PlayerWebView is the main SDK component that allows you to load videos easily into your android environment. Add the component to the selected layout which will display the player. To load the video without autoplay, you can use the setPlayWhenReady(false) method.

    <com.dailymotion.android.player.sdk.PlayerWebView
    android:id="@+id/dm_player_web_view"
    android:layout_width="match_parent"
    android:layout_height="215dp">
    </com.dailymotion.android.player.sdk.PlayerWebView>
    
  3. Initialize the player in your selected activity, reference the PlayerWebView and use one of the load methods available. You can use the load() method, which will initialize a default player config, load the player and start playing the selected video. Or it is also possible to use the initialize() method to load the player with a custom config using any available player params.

    lateinit var playerWebView: PlayerWebView
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.screen_sample);
        playerWebView = findViewById(R.id.playerWebview)
        val params = mapOf("video" to "x7tgad0")
        playerWebView.load(loadParams = params);
    }
    

Using player parameters

In order to customize the player, pass in player parameters to your player instance. Create a Map interface, add an entry of the chosen player parameters into the map along with its associated value, then pass the Map into the initialize() method. To load multiple videos while keeping the same player instance and config, use the load() method after player initialization.

val params = mapOf(
    "ui-highlight" to "fff",
    "queue-enabled" to "true",
    "logo" to "false"
)
dailymotionVideoPlayer.initialize("https://www.dailymotion.com/embed/", params = params, emptyMap())

Please find the full player params list in our Player API reference here.

Methods

Once the SDK is loaded, you can use the Player API to control the player. You have full access to all player methods and there are also methods supplied in the Android SDK that return specific player properties. When the player is ready to take API commands it will send ApiReadyEvent event.

dailyMotionVideoPlayer.pause();
NameInfo
load(String)Calls the initialize method, loads the player with a video associated with the video id (e.g. x7tgad0)
initialize(String, Map<String, String>, Map<String, String>)Loads the player with base string URL of player' https://dailymotion.com/embed/' accompanied by a MAP interface of required player parameter values
finishedInitialization (String, Map<String, String>, Map<String, String>)Loads the player with a given URL, parameters and advertising ID
play()Starts or resumes video playback
pause()Starts or resumes video playback
setFullScreenButton(Boolean)Enters fullscreen mode when true and controls player fullscreen button state. The method should be utilized in association with the native fullscreen functionality in app
setPlayerEventListener(Eventlistener)Add a listener which will be called when the Android system WebView can an error
unmute()Unmute the player
mute()Mute the player
callPlayermethod(String, Object)Call a method from the Js Player API, if not already exposed in the Android SDK
setPlayWhenReady(Boolean)Set the autoplay behavior of the player when video is loaded. Set to true, for autoplay enabled.
setQuality(String)Set player to play at a specified quality if available ['240', '380', '480', '720', '1080', '1440', '2160' 'default']
setSubtitle(String)Activate subtitles track to a specified language if available
setVolume(float)Set the player's volume to the specified level between 0 & 1. ie, 0.5 = 50%
release()Destroy the Player webView
seek(double)Seek to the specified time in video playback in seconds
setIsWebContentDebuggingEnabled()Enable the Android system WebView debug mode
setMinimizeProgress(float)Disable the player UI when set to 0, enables when 1
setWebViewErrorListener(WebViewErrorListener)Add a listener for Android system WebView error
showControls()Enable the display of the player UI
toggleControls()Turn on/off the player's UI components
togglePlay()Switch between player & pause

In order to make a developer's life easier, we created methods in our android SDK that will return the value of a specific player property. Not all player properties are returned by a set method, some are returned in the payload sent after the player event, please see here for more info about events.

NameInfo
getBufferedTime()Returns a Double Number. The part of the media resource that has been downloaded in seconds
getVideoPaused()Returns a boolean value for current pause state of the player
getVolume()Returns a float value for the volume property between 0 and 1
isEnded()Returns a boolean value for whether the media resource has ended
isSeeking()Returns a boolean value for whether the video resource is seeking
getDuration()Returns a double value for the length of a media resource in seconds
getPosition()Returns a long value of the current playback position in seconds

Player events

The player emits specific events about changes in its state. For specific player events, you can add event listeners. For certain events, it's possible to access the corresponding player property value using the payload method.

EventInfoPayload method
ApiReadyEventSent when the player is ready to accept API commands. Do not try to call functions before receiving this event
StartEventSent the first time the player attempts to start the playback
VideoChangeEventSent when a new video has been loaded in the playergetPayload() returns video id & video title
LoadedMetaDataEventSent when the video's metadata is loaded
AdStartEventSent when the player starts to play an ad media resource
AdTimeUpdateEventSent when the playback position of an ad changes
AdPlayEventSent when the player starts the playback of an ad
AdPauseEventSent when the player pauses an ad resource
AdEndEventSent when the player reaches the end of an ad media resource
VideoStartEventSent when the player starts to play the media resource
TimeUpdateEventSent when the playback position changes
SeekingEventSent when the player is starting to seek to another position in the videogetPayLoad() will return the position at which the seek method was triggered
SeekedEventSent when the player has completed a seeking operationgetPayLoad() will return the position at which the seek method seeks to
ProgressEventSent when the browser is fetching the media data
DurationChangeEventSent when the duration property of the video becomes available or changes after a new video loadgetPayload() returns the duration property of the video
PlayingEventSent when the content media resource playback has started
PauseEventSent when the content media resource playback has paused
VideoEndEventSent when the player reaches the end of the content media resource
PlaybackReadyEventSent when playback starts after the play method returns
QualitiesAvailableEventSent when qualities are availablegetPayload() returns qualities which are available
QualityChangeEventSent when the video quality changesgetPayload() returns the quality value
VolumeChangeEventSent when the volume or mute state changesgetPayload() returns volume state and muted state
FullScreenToggleRequestedEventSent when the fullscreen toggle button is requested
ControlChangeEventSent when the UI controls appear or disappeargetPayload() returns if player UI controls are visible

Below is an example of adding listeners for multiple events, it is then possible to use the event payload method to get the corresponding events property value.

dailyMotionVideoPlayer.setEventListener { event ->
    when (event) {
        is ApiReadyEvent -> ...
        is StartEvent -> ...
        is LoadedMetaDataEvent -> ...
        is ProgressEvent -> ...
        is DurationChangeEvent -> ...
        /* And many more event */
        else -> {
            /* In case a POJO is not available you can directly access the raw data */
            if (event.name == "_generic_") {
                /* Do some stuff for my event: parse the raw date to extract the event name or values */
                Log.d("Event with payload: ${event.payload}")
            }
        }
    }
}

Best practices

Player Ready Event:
When using the Player with any of our of SDKs, we recommend before you make any API commands, wait till after the API ready event is sent by the player. You can pick this up in your android app using the ApiReadyEvent.

Preload player:
It's possible to load the player and the video separately. In your application, you can preload the player before the user attempts to play a video. In order to preload the player without a video being displayed. Use the initialize() method and base the baseUrl of just the player with a video not defined, https://www.dailymotion.com/embed/.

Reuse player:
When utilizing the player via our SDKs in an application, you can reuse the same player instance. Use the load() method passing in the video id after initializing the player.

Handle full-screen orientation:
Any activity you are using your player in, you should add the below snippet in your AndroidManifest.XML . The setFullScreenButton() method which is available, doesn't have complete control of the full-screen functionality in your application. This should be used in parallel with your own native application functionality adjusting the player to take the whole screen space. This method controls the UI fullscreen component and updates the player state.

android:configChanges="orientation|screenSize"

Google player services:
The SDK uses Google Play Services to get the Advertising Id, you may want to override the play-services-ads version to avoid conflicting with other play services artifacts.

dependencies {
    implementation "com.google.android.gms:play-services-ads:[your_play_services_version]"
}

Picture In Picture:
Our flagship Dailymotion app use our Android SDK, although we can't provide out of the box PiP functionality, it is possible to achieve this like we have done, depending on your software architecture. You can review info on Google's android Picture-in-Picture support here.

iOS SDK (Swift)

When to use

The Dailymotion Swift iOS SDK is a swift wrapper around the WKWebView Class that allows developers to easily embed the Dailymotion Player in their app and let them communicate with its API natively.

The Swift iOS SDK is open source and you can get all required information plus a sample app here on our GitHub. It requires Xcode 8 and later, Swift 4 and iOS 8+. If you require an Objective-C version please check out our git here.

How to use (4 steps)

  1. Add our SDK to your project, the easiest way to do so is with CocoaPods, a dependency manager solution. Add the below pod to your Podfile.

    use_frameworks!
    pod 'DailymotionPlayerSDK'
    
  2. Import DailymotionPlayerSDK into each file where you need to create an instance of Dailymotion player.

    import DailymotionPlayerSDK
    
  3. Inside a view controller where you want to display the player, create a fresh DMPlayerViewController instance and set your view controller as delegate. Please, ensure your view controller conforms to the DMPlayerViewControllerDelegate protocol.

    import DailymotionPlayerSDK
    
    class VideoViewController: UIViewController, DMPlayerViewControllerDelegate {
    
        private lazy var playerViewController: DMPlayerViewController = {
            let controller = DMPlayerViewController(parameters: [])
            controller.delegate = self
            return controller
        }()
    
        ...
    }
    
    //MARK: - Conform to protocol
    extension VideoViewController: DMPlayerViewControllerDelegate {
        
        ...
    }
    
  4. Add the playerViewController as a child view controller. Then pass a video id to the player load() method. Once the player is initialized, it will take care of loading the video and start the playback.

    playerViewController.load(videoId: "x7tgad0")
    

Using player parameters

To customize the player, select the required parameters from the player parameter list and pass them to the player init method. The params value should contain a String Array with the customization values. If you don't need any customization, pass an empty array.

let parameters: [String: Any] = [
    "logo": "false", //to disable the Dailymotion logo
    "queue-enable": "true", //to enable queue in the player
    "ui-highlight": "FF0000",  //to color the player UI using HEX value
]
let playerViewController = DMPlayerViewController(parameters: parameters)

Methods

Our iOS SDK is loaded with all the functionality you need to create a unique video-centric application. Once the player is loaded, you can use the Player API and our player methods.

playerViewController.play()
MethodDescription
load(params: String)Calls the initialize method, loads the player with a video associated with the video id (e.g. x7tgad0)
play()Starts or resumes video playback
pause()Pauses videos playback
toggleFullscreen()Toggle the fullscreen state of the player and fullscreen UI component. The method should be used in association with the native fullscreen functionality in your app.
unmute()Unmute the player
mute()Mute the player
seek()Seek to the specified time in video playback in seconds.
toggleControls()Disables the player UI when set to false, enables when true

Player events

The player sends events when a specific player property changes or becomes available. It is possible to add listeners to specific events. The events are split between two groups: namedEvent and timeEvent. For a list of all events, please see our Player API reference here.

Below is an example of how to set a listener for loadedmetadata & apiready event.

extension ViewController: DMPlayerViewControllerDelegate { 
    func player(_ player: DMPlayerViewController, didReceiveEvent event: PlayerEvent) {
        switch event {
        case .namedEvent(let name, _) where name == "loadedmetadata":
            print("Player Metadata loaded")
        case .namedEvent(let name, _) where name == "apiready":
            print("Player is ready")
        default:
            break
        }
    }
}

Player properties

It is possible to get access to information about the player's current state or specific player properties. Add a listener to an event and retrieve the corresponding player property, depending on the event type, use the data or position value.

func player(_ player: DMPlayerViewController, didReceiveEvent event: PlayerEvent) {
    switch event {
    case .namedEvent(let name, let data):
        print("\(name) - \(data)")
    case .timeEvent(let name, let position):
        print("\(name) - \(position)")
    }
}

Best practices

Player Ready Event:
When the player is ready to receive API commands it will send the apiready event. Listen to this event to ensure the player is ready to receive any API commands.

Preload player:
In your application, you can preload the player before the user attempts to play a video. In order to load the player, you must use the DMPlayerViewController() method, followed by the load method when you want to load a video in the player.

Reuse player:
When using our player in an application, you can (and should) reuse the same player instance, therefore a single-player instance can load multiple videos.

Handle fullscreen orientation and state:
The toggleFullscreen() method toggles the fullscreen UI component and the player fullscreen state, it doesn't have control of the fullscreen functionality of your application. This method should be used alongside the native functionality adjusting the player orientation. You can see an example of how it could be handled in our sample application.

Sample application:
You can access a sample application utilizing our SDK from our git here. Check out the SDK repo and the sample will be available.

oEmbed API

oEmbed is a format for allowing an embedded representation of a URL on third party sites.
The oEmbed API allows a website to turn a Dailymotion video page URL into a structured data set, making it easy to embed and share content across the web.

When to use it

This protocol is the preferred method when you need to transform the URL provided into an embed code. For more information, see the oEmbed specification.

How to use it

Use the following endpoint to request the corresponding video information using only a Dailymotion video URL. Add in URL params from the table below to configure the response.

https://www.dailymotion.com/services/oembed?url=VIDEO_URL?PARAM1&PARAM2

Example call using URL parameters:

https://www.dailymotion.com/services/oembed?url=https://www.dailymotion.com/video/x7tgad0?maxwidth=480&maxheight=269&autoplay=true

Example JSON response:

{
  "type": "video",
  "version": "1.0",
  "provider_name": "Dailymotion",
  "provider_url": "https://www.dailymotion.com",
  "title": "Midnight Sun | Iceland",
  "description": "",
  "author_name": "Dailymotion player demo",
  "author_url": "https://www.dailymotion.com/dailymotionplayerdemo2",
  "width": 478,
  "height": 268,
  "html": "<iframe frameborder=\"0\" width=\"478\" height=\"268\" src=\"https://www.dailymotion.com/embed/video/x7tgad0?autoplay=true\" allowfullscreen allow=\"autoplay\"></iframe>",
  "thumbnail_url": "https://s2.dmcdn.net/v/SBL5q1U_Klu8xz_7m/x240",
  "thumbnail_width": 427,
  "thumbnail_height": 240
}

URL parameters

ParameterParameter description
url(required) The Dailymotion URL for a video
maxwidthThe maximum width the embedded video can take on the destination page
maxheightThe maximum height the embedded video can take on the destination page
formatResponse format, either json or xml. Defaults to json
callbackWhen returning JSON, wrap in this function
autoplayAutomatically start playback of the video. Defaults to false
syndicationYour syndication key

Customize the player

The Dailymotion Player can be customised to match your brand perfectly, with a modern UI that works across all platforms. But if you need a completely custom experience, our SDKs allow you to disable our interface and develop your own.

Note: some options set in the Partner HQ, such as highlight colour and watermark, can't be overridden via player parameters.

Look & feel

Basic

  • In the Partner HQ within the "Embeds" section, you can customize the main appearance (brand logo, player accent color, video title and other player components) via some WYSIWYG tools.
  • At the iframe embed level you can add dedicated parameters to the src URL field in order to enable/disable or modify some specific properties.

Available features:

FeaturePartner HQPlayer Embed
Thumbnail
Title info
Title display
Language
Geoblocking
Monetization
Playnext
Logo
Logo link
Player highlight colour
Share button
Twitter share signature
Autoplay
Player UI display
Mute
Video quality
Queue
Start time
Publication period
Subtitles
Playlist
Picture-in-Picture
Scroll-to-Play

Advanced

Our Web SDK and Player API are the to-go tools to take full control of the player. You can control not only the behavior of the player but get access to all the properties and methods of the player.

Autoplay

In recent years, browsers on desktop and mobile have been setting stricter autoplaying polices. Although you can activate the autoplay behavior in the player's configuration, complete control over autoplay behavior isn't possible, due to users' browser settings.

To set a video to autoplay, set the autoplay parameter to true in your player configuration.

Our smart autoplay strategy is engineered to maximize the chances of playing a video in all browsers conditions. When autoplay is enabled, the player goes through the following waterfall:

  1. If the browser allows autoplay, the video is played automatically with sound.

  2. If this isn't possible, it attempts to autoplay the video again but muted. In this case on mobile devices, the player will also automatically display a Tap to unmute call to action that allows users to unmute the content with a single tap anywhere on the player.

  3. Finally, if the browser doesn't allow autoplay at all, the player will display a start screen and wait for the user's interaction to start video playback.

JavaScript Player API Reference

Our Player API allows you to interact with and take complete control of the Dailymotion video player. It can be accessed through our SDKs and provides access to all the player methods, events and properties. Our APIs allow you to create a unique and personalized experience.

Methods

Before sending any API commands to a player instance, you should wait for the apiready player event to be fired.

MethodInfoExample
DM.player()Create a player instance. The SDK will take care of generating and injecting an iframe into the div placeholderDM.player(document.getElementById("player")
load(String)Load the player with a video ID (e.g. x7tgad0)player.load('x7tgad0')
load({video: String, playlist: String})Load the player with a video and Up Next Queue populated with a custom playlistplayer.load( {video: 'x7tgad0', playlist: 'x5zhzj' });
play()Start or resume video playbackplayer.play()
pause()Pause video playbackplayer.pause()
setVolume(Float)Set the player's volume to the specified level between 0 & 1. ie, 0.5 = 50%player.setVolume(0.5)
setSubtitles(String)Activate subtitles track to a specified language if availableplayer.setSubtitle('fr')
seek(Float)Seek to the specified time in video playback in secondsplayer.seek(30)
setQuality(String)Set the video's quality to the specified quality ['240', '380', '480', '720', '1080', '1440', '2160' 'default']player.setQuality('720')
setMuted(Boolean)Enable or disable muteplayer.setMuted(true)
setFullscreen(Boolean)Enable or disable fullscreen modeplayer.setFullscreen(true)
setControls(Boolean)Enable or disable the player's controls UIplayer.setControls(false)
togglePlay()Switch the player's playback state between play/pauseplayer.togglePlay()
toggleControls()Switch the player's controls UI between enabled/disabledplayer.toggleControls()
toggleMuted()Switch the player's Mute state between muted/unmutedplayer.toggleMuted()
watchOnSite()Redirect to watch video on Dailymotion.complayer.watchOnSite()

Events

The player emits events relating to the change of the player state, video playback and ad content.To listen to specific player events, you must integrate the player using our SDKs.

Player events

Player eventDescription
apireadySent when the player is ready to accept API commands. Do not try to call functions before receiving this event
controlschangeSent when the availability to use our player controls changes (visible or hidden)
startSent the first time the player attempts to start the playback, either because of user interaction, an autoplay parameter or an API call (e.g play(), load(), etc.)
endSent when playback of the content video, and eventual post-roll ad video, is completed
endedDeprecated. Use video_end instead
errorSent when the player triggers an error. Please error codes here
fullscreenchangeSent when the player enters or exits the fullscreen state
playback_readySent every time a video is ready to play, or started playing (depending on autoplay settings, and their resolution by the browser), or is unable to play (blocked, restricted, unavailable). Listen to this event if you want to defer doing network-heavy and JavaScript-heavy work, to allow the optimal delivery of the first frames of the video to the use
seekingSent when the player starts to seek to another position in the video timeline
seekedSent when the player has completed a seeking operation
videochangeSent when a new video has been loaded in the player. (e.g. after calling load(videoId, [params]), or at player start-up)
volumechangeSent when the volume or mute state changes

Video events

Video eventDescription
video_startSent when the player begins playback of the content video
video_endSent when the player completes playback of the content video
pauseSent when the video playback has paused
playSent when the playback state of the content video is no longer paused, as a result of the play method or the autoplay attribute
playingSent when the content video starts playing, after the play or waiting event
durationchangeSent when the duration property of the video becomes available or changes after a new video load
loadedmetadataSent when the video's metadata is loaded
waitingSent when the player has to temporarily stop video playback for further buffering of content
subtitlechangeSent when the current subtitle changes
subtitlesavailableSent when subtitles are available, wait until the apiready event to set subtitle via the API
qualitiesavailableSent when video qualities are available
qualitieschangedSent when the video quality changes
timeupdateSent when the playback position changes
progressSent when the browser is fetching the media data

Ad events

Ad eventDescription
ad_startSent when the player begins playback of an ad video
ad_endSent when the player completes playback of an ad video
ad_pauseSent when the player pauses an ad
ad_playSent when the ad playback starts
ad_timeupdateSent when the playback position of an ad changes
ad_companionsSent when a companion ad is received. Companion ads should be played in sync with the main ad (linear/non-linear) by listening to events ad_start and ad_end
//An example listener to check if the player is ready to accept API commands
player.addEventLister('apiready', function(){
    console.log('Player Ready'); 
});

Player Properties

The player API grants access to information about the player's current state and specific properties.

PropertyInfoType
bufferedTimeThe part of the media resource that has been downloaded in seconds.Number
controlsWhether the player controls are enabledBoolean
currentTimeThe current playback position in secondsNumber
durationThe duration time of the video resource in secondsNumber
endedWhether the video has endedBoolean
errorContains error code, title and message about the last error that occurred in the playerObject
fullscreenWhether the player is in full-screen modeBoolean
mutedWhether the player is currently mutedBoolean
pausedWhether the current playback state is pausedBoolean
qualitiesThe video qualities that are availableArray
qualityThe current quality value of the video element loadedString
seekingWhether the video element is seekingBoolean
subtitleThe subtitle language code that is currently enabledString
subtitlesThe available subtitle language codes of the media fileArray
volumeThe current volume level. Between 0.0 to 1.0. The volume and mute params operate separately, therefore, you could have a player with full volume, but also mutedNumber
videoContains the video ID and titleObject
companionAdsAn array of parsed companion ad creativesArray
//Logging a video title to the console
console.log(player.video.title)

Player Parameters

Use the below parameters to customize your player via the iframe or SDK embed.

ParameterInfoType
autoplayAutomatically attempt to start playback with sound, if it is blocked by the browser, the player will force the video muteBoolean
controlsWhether to display the player controls, true by defaultBoolean
idID of the player unique to the page to be passed back with all API messagesString
muteWhether to mute the videoBoolean
qualitySpecify the suggested playback quality for the videoNumber
queue-autoplay-nextWhether to automatically play the next item in the queueBoolean
queue-enableWhether to show the Up Next QueueBoolean
sharing-enableWhether to display the sharing buttonBoolean
startSpecify the time (in seconds) from which the video should start playingNumber
subtitles-defaultSpecify the default selected subtitles languageString
syndicationPass your syndication key to the playerString
ui-highlightChange the default highlight color used in the controls (hex value without the leading #). Color set in the Partner HQ will override this paramString
ui-logoWhether to display the Dailymotion logoBoolean
ui-start-screen-infoWhether to show video information (title and owner) on the start screenBoolean
playlistSpecify a playlist ID to populate the Up Next Queue with videos from a playlistString

Iframe

Add the parameter to the src URL after the video id separated with the ? character. If you want to use multiple parameters at once, separate each with an &.

<iframe frameborder="0" width="640" height="360" 
    src="https://www.dailymotion.com/embed/video/x7tgad0?autoplay=true&ui-logo=false" 
    allowfullscreen 
    allow="autoplay; fullscreen">
</iframe>

Web SDK

Add the parameter to the params object in your player variable, using the DM.player() function.

var player = DM.player(document.getElementById("player"),{ 
    video: "x7tgad0",
    width: "100%",
    height: "100%",
    params: {
        'autoplay': 'true',
        'ui-logo': 'false'
    } 
});

Android SDK

Create a Map interface, add the chosen player parameters into the map along with its associated value, pass the map into the initialize() method.

val params = mapOf(
    "ui-highlight" to "fff",
    "queue-enabled" to "true",
    "logo" to "false"
)
dailymotionVideoPlayer.initialize("https://www.dailymotion.com/embed/", params = params, emptyMap())

iOS SDK

Add the parameters so a String array and pass it into the initialize DMPlayerViewControllers() method.

let parameters: [String: Any] = [
    "logo": "false", //to disable Dailymotion logo
    "queue-enable": "true", //to enable queue in the player
    "ui-highlight": "FF0000",  //HTML hex color value to color player UI
]
let controller = DMPlayerViewController(parameters: parameters)
controller.delegate = self
    return controller
  }()