Skip to main content

Introduction

Welcome to the VP Player documentation! 👋

Here, you will learn how to add and configure a video player on your page. Several ways to add the player include managed hosting, customized setup, self-configured options, and self-hosted options.

Add player​

VP Player allows different ways how to add a player directly to your page; in this section we have listed the main ways how to add a player on your page:

  1. Managed: The player is fully hosted on VP infrastructure, and the configuration is managed through the VP Player interface. You can specify the player, ad, and video details through the interface, and the player will be automatically updated with these settings.
  2. Self-configured: The self-configured player relies on VP services to deliver and host the player script, while the client is responsible for configuring the player independently. This allows for the creation of different players that can meet various needs.
  3. Self-hosted: The client has complete control over hosting and configuring the player on their own servers.

Managed​

The player is fully hosted on VP infrastructure, and the configuration is managed through the VP Player interface. You can specify the player, ad, and video details through the interface, and the player will be automatically updated with these settings.

Implementation:

  • From the VP Player interface, go to the "Video Players" section and select the player you want to use. The player id will be in the form of pxxxxxxx.
  • From the VP Player interface, go to the "Videos" section and select the video you want to play. The video id will be in the form of vxxxxxxx.
  • From the VP Player interface, go to the "Ad Schedules" section and select the ad schedule you want to use. The ad schedule id will be in the form of sxxxxxxx. Note that the ad schedule id is an optional parameter, so you can skip this step if you do not want to use an ad schedule.
  • The link to the player is formed in this way: https://host.vpplayer.tech/player/{r:playerId}/{r:videoId}/{o:scheduleId}.js
// Adding a managed player to your page
<script src="https://host.vpplayer.tech/player/pxxxxxxx/vxxxxxxx/sxxxxxxx.js"><script>

Self-Configured Player​

The self-configured player relies on our services to deliver and host the player script, while the client is responsible for configuring the player on their own. This allows for the creation of different types of players that can meet various needs.

Implementation:

  • From the VP Player documentation, choose the version of the player you want to use. The version will be in the format of vX.X.X. You can find a list of available versions on the [versions page](add link).
  • The link to the player version can be constructed using the following format: https://host.vpplayer.tech/player/vX.X.X/vpplayer.js, where X.X.X is replaced with the desired version number. For example, the current most updated version is v2.1.1.

If you want to always have the latest version of VP Player, you can use this hosting url: https://host.vpplayer.tech/player/latest/vpplayer.js 

<!-- Adding a self-configured player to your page -->
<script src="https://host.vpplayer.tech/player/vX.X.X/vpplayer.js"><script>

<div id="vp-player"></div>
<script>
    vpPlayer("vp-player").setup({});
</script>

Self-Hosted Player​

The self-hosted player relies on your services to deliver and host the player script and the configuration.

Implementation:

  • From the VP Player documentation, choose the version of the player you want to use. The version will be in the format of vX.X.X. You can find a list of available versions on the [versions page](add link).
  • You download the player version and you upload on your own services, whether you are going to add as a part of any bundle script that you create, or hosting on a service.
  • The link to the player will be constructed and provided by your internal team.