Videos
Embed videos
Once a video is published in your account, it can be embedded in your own website or web app by simply copy/pasting the corresponding iframe embed code in your HTML. This integration method allows the player and the media content to be powered by Frontlayer in a completely white-label mode.
The player code is hosted and periodically updated at the platform level. The media content is encoded, optimized and streamed from our global distribution network (CDN). However, there is no visual reference to Frontlayer when embedding the video, and visitors perceive it as a standard media component of your own website or web app, under your own domain name.
The process for embedding a video is as follows:
1. From the main "Videos" section of the web portal, locate the row corresponding to the video you would like to embed, and then click on "Action" -> "Embed".
2. A pop-up window will open, and you will see 2 codes: "Web player" and "Direct link". In this case, we will be using "Web player", which is the iframe embed code for your video. The "Direct link" code can be used as a test URL to access your published video from any web browser.
Copy the "Web player" code and paste it in your website's HTML code, right where you would like your video to be displayed. The "Web player" code behaves like a regular HTML component, more specifically an iframe. By default, you will notice that the code references 560px width X 315px height dimensions. You can manually customize these variables when pasting the code in your own website to match the desired dimensions.
When using custom dimensions, we recommend trying to maintain a 16:9 aspect ratio, which is the default proportional relation between the width and the height for your videos. If you will be placing the "Web player" code inside a parent div whith predefined dimensions, you can also set the code's "width" variable to "100%", and remove the "height" variable. By doing this, the embedded video will automatically scale to the dimensions of the parent div.
Below is an example demonstrating the integration of a test video in a very simple web page with minimal HTML code, showing both the HTML code and the result:
