Follow

How do I embed a video into my course?

You can embed video into your course content or test question page.

Embed Video takes an embed link (generally .html by a streaming provider such as YouTube) and shows that source’s player, which in turn streams the video.

To embed a video:

  1. Select the Embed Video button from the Insert tab.
  2. Select the area of the page where you want to position the top left corner of the object (you can move or re-size it later).
  3. The Embedded Video Properties right-panel opens.
  4. Enter the embed link in the Source field.
    1. Obtain the embed link from the streaming provider. For example, from YouTube, select your video.
    2. Select the Share button under the video player.
    3. Select the Embed button. Another field opens below containing an embed code. There are also options you can select to customize the player (see note below). The options you select change the embed code, so make your selections first and then click the Embed code field..
    4. Copy the code from the Embed field and paste it into the Source field in Claro.
  5. Select the Verify button. The width and height of the video will be automatically detected when you verify the embed source.
  6. You can add a Title, Description, and Tags on the Details tab.
  7. Select the Update button to finish.

Tips for YouTube Embeds: 

  • Ensure "Show suggested videos when the video finishes” is deselected if you don’t want other distracting videos to display at the end of your selected video.
  • Select “Enable privacy-enhanced mode” so that a YouTube cookie will not be set until the user plays the video.
  • Add some YouTube player parameters to autohide the player controls, remove the YouTube logo from the player controls, hide the information appearing at the top before the video plays, and loop the video so the end screen doesn’t show: After the question mark and “rel=0” (the code pertaining to the related videos), add: &autohide=1&modestbranding=1&showinfo=0&loop=1&playlist=VIDEO_ID (where VIDEO_ID is the number of your video which is after embed/ and before the question mark).

e.g., video tag is

<iframe width="420" height="315" src="http://www.youtube.com/embed/ oHg5SJYRHA0" frameborder="0"></iframe>

Change to:

<iframe width="420" height="315" src="http://www.youtube.com/embed/ oHg5SJYRHA0?autoplay=1" frameborder="0"></iframe>

To see our YouTube video of this process in Claro, play Embed a YouTube video in Claro QuickView:

.

 

See the YouTube links Embed a YouTube video – YouTube Help and YouTube Embedded Player Parameters for more information. Note: Right-click to open these links in a new tab or window.

Tips for Brightcove Embeds:

To ensure the embed functions across all browsers and devices we recommend the following edits (shown in bold font) be applied to the default embed code provided by Brightcove.

 <!-- Start of Brightcove Player -->

<div style="display:none">

</div>

<!--

By use of this code snippet, I agree to the Brightcove Publisher T and C found at https://accounts.brightcove.com/en/terms-and-conditions/.

-->

<script language="JavaScript" type="text/javascript" src="https://sadmin.brightcove.com/js/BrightcoveExperiences.js"></script>

<object id="myExperience2938213698001" class="BrightcoveExperience">

  <param name="bgcolor" value="#FFFFFF" />

  <param name="width" value="576" />

  <param name="height" value="324" />

  <param name="playerID" value="2916067125001" />

  <param name="playerKey" value="AQ~~,AAACpq3DS-E~,AMgQyIT1gNhz4I7QATMsoRBvs4ut2nKg" />

  <param name="isVid" value="true" />

  <param name="isUI" value="true" />

  <param name="dynamicStreaming" value="true" />

  <param name="@videoPlayer" value="2935581894001" />

  <param name="autoStart" value="false" />

  <param name="secureConnections" value="true" />

  <param name="secureHTMLConnections" value="true" />

  <param name="wmode" value="transparent" />

</object>

<!--

This script tag will cause the Brightcove Players defined above it to be created as soon as the line is read by the browser. If you wish to have the player instantiated only after the rest of the HTML is processed and the page load is complete, remove the line.

-->

<script type="text/javascript">brightcove.createExperiences();</script>

<!-- End of Brightcove Player -->

 
Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments