Embedding lets you put the Vidreno player directly on your own site. Your visitors watch without ever leaving your page. This guide walks through every option in the embed panel and what each one does.
Get the embed code
- From your dashboard, hover over a video card and click the embed icon (the angle brackets).
- Or open the video page and click the Embed button.
- The embed dialog opens with all the options. Adjust them to taste, then click Copy Embed Code at the bottom.
- Paste the snippet into your site wherever you want the player to appear.
The snippet is a standard HTML iframe. If you have never used an iframe before, the MDN reference for the iframe element is a great primer.
Your choices are baked into the embed link and the generated code. Flip a toggle and the code updates straight away, so always copy the code after you have finished setting things up.
Layout and size
These options control how big the player is and where it sits on your page.
Responsive width (100 percent)
On by default. The player fills the full width of whatever container it sits in and keeps its shape, so it looks right on phones, tablets and desktops. While this is on, the fixed width and height boxes are hidden because they are not needed.
Width and height (px)
Only shown when responsive width is off. The defaults are 560 by 315. Use these when you want a player of a fixed size rather than one that stretches to fit.
Maintain 16:9 aspect ratio
On by default. When this is on, changing the width updates the height for you, and changing the height updates the width, so the video never looks squashed or stretched.
Border radius (px)
The default is 10. Set it to 0 for square corners, or a higher number for softer rounded corners. We suggest somewhere between 0 and 20, and the maximum is 50.
Alignment
Left, Centre or Right. The default is Centre. This decides where the player sits inside its space on the page.
Playback
These options control how the video behaves when the page loads.
Autoplay
Off by default. The video tries to start playing on its own as soon as the page loads.
Most browsers only allow autoplay when the video is also muted. If you want autoplay to work reliably, turn on Muted as well.
Muted
Off by default. The video starts with no sound. This is often paired with Autoplay.
Loop
Off by default. The video starts again automatically when it reaches the end.
Show controls
On by default. Shows the play, pause, volume and progress controls. Turn it off for a clean player with no controls on screen.
Allow fullscreen
On by default. Lets viewers expand the video to fill their whole screen.
Player permissions
These map to the iframe allow list. They decide what the player is allowed to do inside the page.
Picture in picture
On by default. Lets viewers pop the video out into a small floating window while they carry on browsing.
Accelerometer
On by default. Lets the player respond to device motion, which some interactive or 360 style videos use.
Gyroscope
On by default. Similar to the accelerometer. It is used for motion aware playback on phones.
Encrypted media
On by default. This is needed for protected content playback in some browsers. It is safe to leave on.
A typical embed
The code you copy looks something like this:
<iframe src="https://vidreno.com/embed/abc123?autoplay=0&muted=0&controls=1"
width="640" height="360"
frameborder="0"
allowfullscreen></iframe>
You can resize the iframe with CSS the same way you would any other element.