Migrate to the Player Embed

In December 2021, we released our new embed method : Player Embed.

This enhanced embed experience allows you to benefit from a more advanced Player experience providing improved viewability and monetization rates.

This method is now considered our default embed experience and is easily customizable and accessible directly from your Dailymotion Studio.

If you are already embedding our Player on your properties and would like to migrate from your old embed methods to the new default embed type, you'll learn how to in this guide.

Choose the best Player embed method to replace your existing integration

The Player Embed has been designed to provide more powerful and easier to use integrations methods. There are different integration methods available depending on your technical preference or environment. We recommend using one of the script embeds types where possible.

Here are the new embed methods available with the Player Embed:

Embed script	Embed using JavaScript, the single line script will load the Player at the point where you add it to the HTML page. This also provides access to the Player API
Library Script	Add just the library and create the player programmatically using the Player API
Iframe	The iFrame embed method is the most basic way to integrate the Player. Advanced smart functionality such as `PiP` and `firstTimeView` will not be available

I'm currently using	We recommend you to use
CPE	Player Embed Script
JS SDK	Library Script
Iframe	Player Embed/iFrame

Player integration in native applications

The latest embed type is engineered to be easily integrated on desktop and web applications.

However, if you would like to integrate our player in a native application, we invite you to use our Android SDK and our Swift SDK.

Compare your existing integration with the recommended Player Embed method

CPE

Integration principles

Current	Player Embed Script
The CPE integration requires 2 steps: Add a placeholder for the Player(s) Add the generated CPE script available in the Dailymotion Studio template section	The Player Embed Script requires 1 step: 1) Add the single-line script accessed in the Players tab from your Dailymotion Studio

Current

Player Embed Script

The CPE integration requires 2 steps:

Add a placeholder for the Player(s)
Add the generated CPE script available in the Dailymotion Studio template section

The Player Embed Script requires 1 step:

1) Add the single-line script accessed in the Players tab from your Dailymotion Studio

Integration steps

Current	Player Embed

Customization

Current	Player Embed
The CPE offers limited customization on your Dailymotion Studio such as : Player controls management Picture-in-Picture management Autoplay management Additional customization could be added to: The player placeholder script, using legacy player parameters The CPE script, using the Player parameters	Control a large set of features and manage the Player experience directly from your Dailymotion Studio, including : Picture-in-Picture management Autoplay management Watermark management Player UI & controls Aspect ratio Some Player parameters are also available for niche customization.

Current

Player Embed

The CPE offers limited customization on your Dailymotion Studio such as :

Player controls management
Picture-in-Picture management
Autoplay management

Additional customization could be added to:

The player placeholder script, using legacy player parameters
The CPE script, using the Player parameters

Control a large set of features and manage the Player experience directly from your Dailymotion Studio, including :

Picture-in-Picture management
Autoplay management
Watermark management
Player UI & controls
Aspect ratio

Some Player parameters are also available for niche customization.

Autoplay

Current	with Player Embed
Autoplay From your Dailymotion Studio, you were able to define the scroll-to-play behavior: Scroll-to-play on Scroll-to-play off Sound You were able to define if the sound should be activated or if the player has to be muted. This option is now deprecated as the main internet browsers are now managing this parameter directly.	Autoplay From your Dailymotion Studio, you'll be able to define the autoplay behavior expected for each Player configuration, including : On Off First time viewable Sound As internet browsers are directly managing the autoplay with sound, the sounds settings have been automatically removed and are managed automatically.

Current

with Player Embed

Autoplay

From your Dailymotion Studio, you were able to define the scroll-to-play behavior:

Scroll-to-play on
Scroll-to-play off

Sound

You were able to define if the sound should be activated or if the player has to be muted.

This option is now deprecated as the main internet browsers are now managing this parameter directly.

Autoplay

From your Dailymotion Studio, you'll be able to define the autoplay behavior expected for each Player configuration, including :

On
Off
First time viewable

Sound

As internet browsers are directly managing the autoplay with sound, the sounds settings have been automatically removed and are managed automatically.

Picture-in-Picture

Feature	Current	with Player Embed
UI	The Picture-in-Picture UI on this integration is using the standard player UI, repositioned and resized.	The PiP UI on this integration has its own interface, allowing your audience to benefit from an optimised interface depending on their device.
Modes	2 options were available: PiP (via the Dailymotion Studio) Instant PiP (via script parameters)	3 modes are available: Picture-in-Picture off Picture-in-Picture on Instant Picture-in-Picture
Size	From your Dailymotion Studio, you were able to select between 2 PiP size: Medium (365x205px) Large (410x230px)	The PiP is now responsive by default to ease your integration. It's also maximizing your viewability with the following size rules: PiP desktop size is minimum 410px PiP mobile is always 100% of the screen width
Position	2 options were available: PiP (via the Dailymotion Studio) Instant PiP (via script parameters)	The PiP position is now different based on the device. On mobile and narrow screens, the PiP is activated at the top of the screen and can be expanded / collapsed On desktop, the PiP is activated on the bottom right per default. You can now easily customize the PiP position with CSS properties.
API	The PiP from this integration wasn't accessible through the AP	You can now programmatically control some elements from the PiP. If you want to learn more, please read our developer portal

Feature

Current

with Player Embed

The Picture-in-Picture UI on this integration is using the standard player UI, repositioned and resized.

The PiP UI on this integration has its own interface, allowing your audience to benefit from an optimised interface depending on their device.

Modes

2 options were available:

PiP (via the Dailymotion Studio)
Instant PiP (via script parameters)

3 modes are available:

Picture-in-Picture off
Picture-in-Picture on
Instant Picture-in-Picture

Size

From your Dailymotion Studio, you were able to select between 2 PiP size:

Medium (365x205px)
Large (410x230px)

The PiP is now responsive by default to ease your integration. It's also maximizing your viewability with the following size rules:

PiP desktop size is minimum 410px
PiP mobile is always 100% of the screen width

Position

2 options were available:

PiP (via the Dailymotion Studio)
Instant PiP (via script parameters)

The PiP position is now different based on the device.

On mobile and narrow screens, the PiP is activated at the top of the screen and can be expanded / collapsed

On desktop, the PiP is activated on the bottom right per default.

You can now easily customize the PiP position with CSS properties.

API

The PiP from this integration wasn't accessible through the AP

You can now programmatically control some elements from the PiP.

If you want to learn more, please read our developer portal

Player size

Current	with Player Embed
Smart embed, managed by CPE. 16:9 only	The Player Embed is by default responsive. You can also force an aspect ratio from your player settings with one of the following value: 16:9 4:3 1:1 3:4 9:16 Inherit

Current

with Player Embed

Smart embed, managed by CPE. 16:9 only

The Player Embed is by default responsive.

You can also force an aspect ratio from your player settings with one of the following value:

16:9
4:3
1:1
3:4
9:16
Inherit

Integrate multiple players

Current	with Player Embed

JS SDK

Integration principles

Current	with Player Library Script
The JS SDK is a 3 steps integration: Implement the Player Library JS SDK on your properties Prepare placeholders for the Player(s). Use the JavaScript to initiate the Player via the Player API	The Player Library Script integration and the JS SDK integration are similar: Implement the Player library script on your properties Prepare placeholders for the Player(s). Use the JavaScript to initiate the Player via the Player API With this integration, you will also benefit from the Player ID allowing you to easily load your configuration and track the performance of your players.

Current

with Player Library Script

The JS SDK is a 3 steps integration:

Implement the Player Library JS SDK on your properties
Prepare placeholders for the Player(s).
Use the JavaScript to initiate the Player via the Player API

The Player Library Script integration and the JS SDK integration are similar:

Implement the Player library script on your properties
Prepare placeholders for the Player(s).
Use the JavaScript to initiate the Player via the Player API

With this integration, you will also benefit from the Player ID allowing you to easily load your configuration and track the performance of your players.

Integration steps

Current	with Player Embed

Customization

Current	with Player Library Script
All Player customization of this integration is controlled via Legacy parameters passed into the DM.player()method	A large set of features and cosmetic options can be managed directly from your Dailymotion Studio. As the Player ID is included in the Player Library Script code, your configuration will be automatically loaded when the player will initialize. Some params are also available for niche customization.

Current

with Player Library Script

All Player customization of this integration is controlled via Legacy parameters passed into the DM.player()method

A large set of features and cosmetic options can be managed directly from your Dailymotion Studio.

As the Player ID is included in the Player Library Script code, your configuration will be automatically loaded when the player will initialize.

Some params are also available for niche customization.

Autoplay

Current	with Player Library Script
Autoplay The autoplay behavior is managed via parameters. The available parameters were allowing you to set the autoplay on or off. Sound The sound behavior is managed via parameters. The available parameters were allowing you to set the sound on or off.	Autoplay From your Dailymotion Studio, you'll be able to define the autoplay behavior expected for each Player configuration, including : On Off First time viewable Sound As internet browsers are directly managing the autoplay with sound, the sounds settings have been automatically removed and are managed automatically.

Current

with Player Library Script

Autoplay

The autoplay behavior is managed via parameters.

The available parameters were allowing you to set the autoplay on or off.

Sound

The sound behavior is managed via parameters.

The available parameters were allowing you to set the sound on or off.

Autoplay

From your Dailymotion Studio, you'll be able to define the autoplay behavior expected for each Player configuration, including :

On
Off
First time viewable

Sound

As internet browsers are directly managing the autoplay with sound, the sounds settings have been automatically removed and are managed automatically.

Picture-in-Picture

The Picture-in-Picture feature was not available on the JS SDK.
By migrating from the JS SDK. to the Player Library script method, you'll be able to use the Picture-in-Picture mode:

Feature	with Player Library Script
UI	The PiP UI on this integration has its own interface, allowing your audience to benefit from an optimisez interface depending on their device.
Modes	3 modes are available: Picture-in-Picture off Picture-in-Picture on Instant Picture-in-Picture
Size	The PiP is now responsive by default to ease your integration. It's also maximizing your viewability with the following size rules: PiP desktop size is minimum 410px PiP mobile is always 100% of the width
Position	The PiP position is now different based on the device. On mobile and narrow screens, the PiP is activated at the top of the screen and can be expanded / collapsed On desktop, the PiP is activated on the bottom right per default. You can now easily customize the PiP position with CSS properties.
API	You can now programmatically control some elements from the PiP. If you want to learn more, please read our developer portal

Feature

with Player Library Script

The PiP UI on this integration has its own interface, allowing your audience to benefit from an optimisez interface depending on their device.

Modes

3 modes are available:

Picture-in-Picture off
Picture-in-Picture on
Instant Picture-in-Picture

Size

The PiP is now responsive by default to ease your integration. It's also maximizing your viewability with the following size rules:

PiP desktop size is minimum 410px
PiP mobile is always 100% of the width

Position

The PiP position is now different based on the device.

On mobile and narrow screens, the PiP is activated at the top of the screen and can be expanded / collapsed

On desktop, the PiP is activated on the bottom right per default.

You can now easily customize the PiP position with CSS properties.

API

You can now programmatically control some elements from the PiP.

If you want to learn more, please read our developer portal

Player size

Current	with Player Library Script
With the JS SDK integration, you have to define a responsive parent container which will control the Player size.	The Player Embed is by default responsive. You can also force an aspect ratio from your Dailymotion Studio with one of the following values: 16:9 4:3 1:1 3:4 9:16 Inherit

Current

with Player Library Script

With the JS SDK integration, you have to define a responsive parent container which will control the Player size.

The Player Embed is by default responsive.

You can also force an aspect ratio from your Dailymotion Studio with one of the following values:

16:9
4:3
1:1
3:4
9:16
Inherit

iFrame

Integration principles

Current	with Player Embed iframe
The iframe integration is a 1 step integration which doesn't have access to the Player API. All you have to do is to copy the iframe embed code available on each video on Dailymotion.com, or directly on your Dailymotion Studio.	In additional to our recommended Player Library Script and Player Embed script methods, you can use the Player embed iframe method to embed your player. All you have to do is to copy the iframe available on the Player section of your Dailymotion Studio. Please note that the Player embed iframe has less customization and advanced features than the Player Library script and Player Embed script

Current

with Player Embed iframe

The iframe integration is a 1 step integration which doesn't have access to the Player API.

All you have to do is to copy the iframe embed code available on each video on Dailymotion.com, or directly on your Dailymotion Studio.

In additional to our recommended Player Library Script and Player Embed script methods, you can use the Player embed iframe method to embed your player.

All you have to do is to copy the iframe available on the Player section of your Dailymotion Studio.

Please note that the Player embed iframe has less customization and advanced features than the Player Library script and Player Embed script

Integration steps

Current	with Player Embed

Customization

Current	with Player Embed
Players embedded with this integration method can be controlled via legacy parameters passed within the iframe	Players embedded with this integration can be customized in the Player configuration from the Dailymotion Studio. Advanced features such as Picture-in-Picture or Aspect ratio won't be applied on this integration method.

Current

with Player Embed

Players embedded with this integration method can be controlled via legacy parameters passed within the iframe

Players embedded with this integration can be customized in the Player configuration from the Dailymotion Studio.

Advanced features such as Picture-in-Picture or Aspect ratio won't be applied on this integration method.

Autoplay

Current	with Player Embed
Autoplay The autoplay behavior is managed via parameters. The available parameters were allowing you to set the autoplay on or off. Sound The sound behavior is managed via parameters. The available parameters were allowing you to set the sound on or off.	Autoplay From your Dailymotion Studio, you'll be able to define the autoplay behavior expected for each Player configuration, including : On Off First time viewable Please note that if you are using the Player Embed iframe, the First time viewable won't work. Sound As internet browsers are directly managing the autoplay with sound, the sounds settings have been automatically removed and are managed automatically.

Current

with Player Embed

Autoplay

The autoplay behavior is managed via parameters.

The available parameters were allowing you to set the autoplay on or off.

Sound

The sound behavior is managed via parameters.

The available parameters were allowing you to set the sound on or off.

Autoplay

From your Dailymotion Studio, you'll be able to define the autoplay behavior expected for each Player configuration, including :

On
Off
First time viewable

Please note that if you are using the Player Embed iframe, the First time viewable won't work.

Sound

As internet browsers are directly managing the autoplay with sound, the sounds settings have been automatically removed and are managed automatically.

Picture-in-Picture

The Picture-in-Picture isn't available on the iframe integration.

Player size

Current	with Player Embed
Not responsive by default, aspect ratio determined via height and the width.	With the new Player embed iframe, the code available on your Dailymotion Studio will be responsive by default. Please note that the aspect ratio compatible with Player Embed iframe is 16:9 Therefore, the aspect ratio settings selected in your Dailymotion Studio won't apply

Current

with Player Embed

Not responsive by default, aspect ratio determined via height and the width.

With the new Player embed iframe, the code available on your Dailymotion Studio will be responsive by default.

Please note that the aspect ratio compatible with Player Embed iframe is 16:9

Therefore, the aspect ratio settings selected in your Dailymotion Studio won't apply

Android & iOS SDK

Integration principles

Current	with Player Embed
The iOS / Android SDK is a 3 steps integration: The player library has to be implemented on your properties Prepare placeholders for the Player(s). Use the JavaScript to initiate the Player via the Player API

Current

with Player Embed

The iOS / Android SDK is a 3 steps integration:

The player library has to be implemented on your properties
Prepare placeholders for the Player(s).
Use the JavaScript to initiate the Player via the Player API

Integration steps

Current	with Player Embed

Customization

Current	with Player Embed
All customization is controlled via Legacy parameters passed into the corresponding create Player Method in the SDK.	Player management using player ID possible in next-generation Native sdk

Autoplay

Current	with Player Embed
Autoplay Only autoplay on or off, managed via params Sound

Current

with Player Embed

Autoplay

Only autoplay on or off, managed via params

Sound

Picture-in-Picture

Player size

Current	with Player Embed

Work with Player Embed API

Some player methods and events have been modified on the Player API.

You'll find the below the methods and events corresponding table.

We remind you that you can also access to the list of all our Player methods, events and parameters directly on the Dailymotion developer portal.

API Methods

Legacy Event	Update
DM.player()	dailymotion.createPlayer( )
load(String)	loadContent()
setMuted()	setMute()
setAdsConfig()	setCustomConfig()
N/A	watchOnSite()
N/A	toggleMuted()
N/A	toggleControls()
N/A	togglePlay()

API Events

Player events

Legacy Event	Update
apiready	On resolve of promise
controlschange	PLAYER_CONTROLSCHANGE
start	PLAYER_START
end	PLAYER_END
error	PLAYER_ERROR
fullscreenchange	PLAYER_PRESENTATIONMODECHANGE
playback_ready	PLAYER_CRITICALPATHREADY
videochange	PLAYER_VIDEOCHANGE
volumechange	PLAYER_VOLUMECHANGE
playback_resolution	PLAYER_PLAYBACKPERMISSION
loadedmetadata	This parameter is no longer available on the new Player API

Video events

Legacy Event	Update
`video_start`	VIDEO_START
`video_end`	VIDEO_END
`pause`	VIDEO_PAUSE
`play`	VIDEO_PLAY
`playing`	VIDEO_PLAYING
seeking	VIDEO_SEEKSTART
seeked	VIDEO_SEEKEND
`durationchange`	VIDEO_DURATIONCHANGE
`waiting`	`VIDEO_BUFFERING`
`subtitlechange`	VIDEO_SUBTITLESCHANGE
`subtitlesavailable`	VIDEO_SUBTITLESREADY
`qualitiesavailable`	VIDEO_QUALITIESREADY
`qualitieschanged`	VIDEO_QUALITYCHANGE
`timeupdate`	VIDEO_TIMECHANGE
`progress`	VIDEO_PROGRESS

Ad events

Legacy Event	Update
`ad_start`	AD_START
`ad_end`	AD_END
`ad_pause`	AD_PAUSE
`ad_play`	AD_PLAY
`ad_timeupdate`	AD_TIMECHANGE
`ad_companions`	`AD_COMPANIONSREADY`
`ad_click`	`AD_CLICK`
`ad_loaded`	AD_LOADED
`ad_impression`	AD_IMPRESSION
`ad_bufferStart`	This parameter is no longer available on the new Player API
`ad_bufferFinish`	This parameter is no longer available on the new Player API

Embed & distribute videos

Choose the best Player embed method to replace your existing integration

Player integration in native applications

Compare your existing integration with the recommended Player Embed method

CPE

Integration principles

Integration steps

Customization

Autoplay

Picture-in-Picture

Player size

Integrate multiple players

JS SDK

Integration principles

Integration steps

Customization

Autoplay

Picture-in-Picture

Player size

iFrame

Integration principles

Integration steps

Customization

Autoplay

Picture-in-Picture

Player size

Android & iOS SDK

Integration principles

Integration steps

Customization

Autoplay

Picture-in-Picture

Player size

Work with Player Embed API

API Methods

API Events

Player events

Video events

Ad events

Related articles