Introduction

Wondering how to showcase your vertical content?

The Dailymotion Player can be set up in a vertical format, making it easy to embed and monetize your vertical videos on native and web environments.

Optimized for mobile devices - Improve user experience without wasting screen space
Easy to share across platforms - Make the most out of your TikTok and Instagram vertical videos by embedding them on your app and website in their original format
Fully customizable - Along with the vertical format, define the UI and Player behaviors your need for a fully custom experience

👍
Alternative
If you prefer defining your Player format via the Dailymotion Studio without manipulating any code, please follow our dedicated guide.

Which aspect ratio?

Define your Player's format using the aspect_ratio Player parameter. For a vertical Player, set its value to either 9:16 or 3:4.

The below demo Player is using 9:16 aspect ratio:

Implementation steps

1. Create a vertical Player

📘
Authentication & scope
To create or modify a Player via the API, make sure you’re authenticated with the manage_players scope. Refer to the authentication guides to see how to authenticate with specific scopes.

Using the below code samples, you can create a new Player or edit an existing one to adapt it to your vertical videos. Perform a POST request and set the aspect_ratio to either 9:16 or 3:4.

// Replace <YOUR_PROFILE_ID> with your own profile ID

curl -X POST -H 'Authorization: Bearer ${ACCESS_TOKEN}' \
       -d 'label=My vertical Player' \
       -d 'aspect_ratio=9:16' \
       -d 'fields=embed_script_url,lib_script_url,embed_html_url' \
    'https://partner.api.dailymotion.com/rest/user/<YOUR_PROFILE_ID>/players'

// Replace <YOUR_PLAYER_ID> with the Player ID you want to modify

curl -X POST -H 'Authorization: Bearer ${ACCESS_TOKEN}' \
       -d 'aspect_ratio=9:16' \
       -d 'fields=embed_script_url,lib_script_url,embed_html_url' \
       'https://partner.api.dailymotion.com/rest/player/<YOUR_PLAYER_ID>'

Create a Player: Try it out!

2. Embed vertical videos

⚠️
Each Player has its own ID. In the example below, xpivc is used as a demo Player ID. Make sure to retrieve and use yours.

As a response to your call, you'll receive the following elements:

id: Your Player ID, the unique identifier of your Player that can be passed in the embed codes right below to carry your custom Player configuration
embed_script_url: Provides the embed code for the Player Embed Script
lib_script_url: Provides the embed code for the Library Embed Script
embed_html_url: Provides the embed code for iFrame integrations

{
    "id": "xpiw2",
    "embed_script_url": "https://geo.dailymotion.com/player/xpiw2.js",
    "lib_script_url": "https://geo.dailymotion.com/libs/player/xpiw2.js",
    "embed_html_url": "https://geo.dailymotion.com/player/xpiw2.html"
}

You can now copy your preferred embed code, add the ID of the video you want to embed, and embed it on your website. For example:

// In this example, the Player ID is xpiw2 and the video ID is x84sh87
// Make sure to replace them with your own IDs

// Player Embed Script example 

<script
src="https://geo.dailymotion.com/player/xpiw2.js" data-video="x84sh87"></script>

Check the guide to retrieve a video ID if you don't know yet how to do.

Check the embed guides to see which embed method best fits your needs and how to use them: