Author’s Note – The following blog post on the subject of customizing your player may also be found as a video tutorial in the Need Help section of your iPlayerHD content manager. The video is titled, appropriately, Popover Embeds.
Like iPlayerHD’s Email Embed feature, the Popover Embed feature allows you to share your videos while crafting a positive experience for your viewers. Specifically, popover embeds allow you to, well, embed your videos on a webpage — no coding knowledge required! When someone clicks on either a thumbnail or link, your video player will come up and play the video.
With a few clicks of your mouse, you can customize your thumbnail image or link. Then simply copy and paste the code that we generate for you. Here are the steps you need to get started, along with a few customization tips you might find helpful.
Once you’re logged in to iPlayerHD, navigate to the Videos page.
Choose the video you’d like to embed, and click on the image. This will take you to the video options page.
Under Display, choose Embed and share.
Select Popover embed.
Adjust the popover embed options (if needed). You can change the width of the video and the image ratio. The ratio defaults to the video’s original ratio.
Add the first lines of code into the header section of your webpage. Your webpage will recognize the script and automatically realize what it does.
Copy the embed code (or the WordPress embed, if you’re using WordPress) and add it wherever you want the popover embed to show up on your webpage.
You also have a few formatting options available to you.
- Thumbnail image (like we used in the example above) or a link (see below)
- If you’re using the thumbnail, you can add a shadow to give the image some depth.
If you run into any trouble, the iPlayerHD support team is happy to help. Feel free to email us at firstname.lastname@example.org.