This documentation explains how to create a window that points to our Vidata player and how to pass the correct parameters to this player to broadcast the right video to the right person.

Contents

Summary

🎈 A Video for Everyone, One Player for All 🎈 : You might be wondering what an "Embed Player" is? In fact, it's a video player that integrates, or "embeds," directly into your website or landing page. Regarding Vidata, our player is the magical tool that will play personalized videos for each of your users.

Imagine a single landing page where each visitor receives a different video, specifically tailored to their own information. No need to create thousands of pages, just one is enough! 🎉

It's a bit like a television broadcasting a different program for each viewer, based on their preferences and personal information. Pretty cool, isn't it? 📺✨

https://media.giphy.com/media/IcT5iBxWIJzMtc364j/giphy.gif

But how does it work? It's thanks to a small piece of code called an "iframe". The iframe is an HTML element that allows you to embed another HTML page into your web page. In our case, it will embed the Vidata player into your page. Rest assured, it's very easy for your technical team to implement! 🛠️👩‍💻

📝 Configuring and installing the Vidata Player 🧩

To broadcast a personalised video, the Vidata player must be integrated into a landing page.

<aside> 💡 What is a player? In this context, a "player" refers to a video player, similar to those you might see on platforms like YouTube or Vimeo. A video player allows you to play a video on a web page. It usually offers standard playback controls, such as the "play" and "pause" button, the progress bar, volume control, and sometimes other features like video quality adjustment, full-screen mode, etc.

In the specific case of Vidata, the "player" or video player is embedded in the client's web page. It is designed to play personalized videos based on parameters defined by the URL or other methods, allowing for a personalized experience for each user.

</aside>

To do this, you will insert a script into the web page where you want to load the Vidata player.

<aside> 💡 What is a script? A script refers to a piece of code written in JavaScript. This script is designed to perform a specific task, such as loading the Vidata player on a web page. The script will be placed in the HTML code of the web page, usually in the <head> section or just before the closing </body> tag.

In short, the script gives instructions to the browser on how to process and display certain elements on the web page, in this case, how to load and display the Vidata video player.

</aside>

Here is the script to insert into the web page where you want to load the Vidata player👇

<script type="text/javascript"> (function(){ var config = { targetElId:'video-container', vidataIdSource: { querystring: 'id'} }; var t = document.createElement("script"); t.type="text/javascript", t.async=false, t.src='<https://player.vidata.io/scripts/vidata-player.js>', t.onload=t.onreadystatechange=function(){ var t = this.readyState; if(!t||"complete"==t||"loaded"==t) try{ VidataPlayer.Setup(config);} catch(t){} }; var e = document.getElementsByTagName("script")[0]; e.parentNode.insertBefore(t,e)})(); </script>

Don't forget to customize these configuration settings to match the specifics of your website and your goals for video distribution. In other words, don't forget to personalize the player's functionality on your website. This could include things like sizing the player, the video to load, adding subtitles, etc. For example, you might want the video player to have a specific width on your site, or for the video to start automatically when the page loads.