Skip to main content

UConn Library's LibGuides Standards and Best Practices — Embedding Videos / Other Media

A guide to help you create and edit your subject, course, topic and general purpose guides

Adding Videos and Other Media

Videos can be embedded into LibGuides through the Media/Widget option in the dropdown menu. Just as with links, images, or other assets, you can add a new Media/Widget or reuse one that already exists on the system.

Embed only Secure Content

Embedded videos, widgets, and other multimedia should ALWAYS load via an encrypted SSL connection. Embedding "mixed content" will trigger an "insecure connection" browser alert.

Embed only secure content by ensuring that your YouTube and other embedded links begin with https rather than http: https://www.youtube.com/ rather than http://www.youtube.com/.

Your public-facing guide should display a green lock in the web address bar (examples below from Google Chrome). Each of your pages should look like this:

 

Not like this:

Icon for an insecure webpage as seen in the Google Chrome browser

Help protect the privacy and security of our users by embedding only secure content!

How to Embed Prezi

The full screen option does not function properly in Firefox. To ensure users can view a Prezi presentation in full screen, a minor modification is needed in the embed code.

In the embed code, add the parameter "&wmode=opaque" within the iframe.

<iframe src="https://prezi.com/embed/etc...etc...etc&wmode=opaque"; allowfullscreen="" mozallowfullscreen="" webkitallowfullscreen="" id="iframe_container" frameborder="0" height="400" width="550"></iframe>

Note in Chrome, the full screen button may be hidden in 2 column layouts.  The column must be at least 67% wide to show the button.

How to Embed Videos

  1. Copy the URL from the YouTube, Vimeo, or other site you wish to share. Remember, embedded content must load via HTTPS in order to display properly and avoid disruptive browser warnings about insecure content. For example, YouTube URLs always should be https://www.youtube.com/ and not http://www.youtube.com/.

  2. Paste the URL into the Embed Responsively tool. http://embedresponsively.com/
    Embed Responsively builds responsive embed codes so your video will display across a variety of devices.

  3. Copy the entire embed code created in Embed Responsively

  4. Add a Media/Widget asset and paste in the copied embed code. Give the widget a Name.

 

The embedded video will be optimized for layout and display regardless of the viewing device.