How to Embed Videos on External Websites
Here’s how to embed one of your videos in “My Media” on an external website.
Within MediaSpace, there are three primary ways to make your videos visible to others:
- Setting the video to "unlisted" and sending viewers the URL
- Adding the video to a channel (where its visibility depends on the channel's privacy settings)
- Adding collaborators (co-viewers, co-publishers, and co-editors) so that your video displays in their "My Media"
- Embedding the video on a website
In this tutorial, we'll review how to embed a video by leveraging MediaSpace. The short version is that you need to find the embed code, copy it, and paste it into the code of your web page.
The Default Embed Player
Beyond the basics you can expect from a video player (a play button, volume controls, etc.), the Kaltura player that shows up on your webpage will have a number of features available to viewers:
- Closed captions, visible by default. Each video that came into Kaltura after 13 June 2020 automatically has machine captions added to the video. These captions will be on/visible by default. Viewers can elect to turn them off if they wish.
- Captions below the video. In order not to obstruct onscreen content, the video doesn't quite fill the player, allowing for black space below the video to display the captions.
- Speed controls. Viewers can watch the video from 25% speed to 300% speed, at 25% increments.
- Video quality selector. Kaltura generates multiple quality levels for every video, which they call "flavors." By default the player will detect the viewer's bandwidth and deliver the video at a commensurate quality level. Viewers can override this automatic choice by using the gear icon.
Whys, Requirements, Caveats
Why You Might Want To Embed a Video
- You want to put your video on a web page
Requirements
- A video for which you are the owner OR a co-publisher
- A web page over which you have editorial control (i.e. so you can edit the code)
Caveats
- Embedding your video on an external website will make your video public - i.e. clever users could grab your embed code and embed it elsewhere
How to Embed a Video
Note that these instructions assume that you have a website over which you have editorial control. Your goal here is to grab the video's embed code, which the website will render as a video player.
- If you're not already logged into MediaSpace, go to https://mediaspace.ucsd.edu, click "Guest" at the top right of the screen and select "Login." Enter your active directory credentials. The screen will refresh and "Guest" at the top of the screen will be replaced with your name.
- Click your name near the top of the page and select "My Media."
- Find the video you want to embed in your list, and click on either the title or the thumbnail.
- Below the video, click the "Share" tab. Information should populate below.
- Click the "Embed" sub-tab.
- If desired, customize the start and end times, as well as the player size.
A Note about Start/End Times
If you set specific start and end times, do know that viewers are still able to manually jump to anywhere they want to be in the video (including before your start time and after your end time). So you're not "hiding" parts of the video from viewers.
- Select all the code in the textbox and copy it (Ctrl-C in Windows, Cmd-C on a Mac).
- Paste the embed code on your web page.