Skip to Main Content

LibGuides Manual

Audio/Video

Audio and video content from the Library of Congress digital collections can be embedded in a LibGuide. This allows for the inclusion of playable media inside of your research guide. Please note: Do not embed media from YouTube or from any other external media site -- you may link to external media, but you may not embed that media on a Library of Congress page.

Video Tutorial - Adding Video or Audio

Start with this short video that includes instructions for embedding audio and video from loc.gov into LibGuides.

View all LibGuides Tutorials on the LS Training website.

Acquiring the Embed Code

Acquire the “Embed Link” code using the Share function from the item page for an audio or video item on the Library's website.

Acquiring Audio Embed Code

Display the "item record" for a audio file from the Library's digital collections. Select the Share button to reveal a dialog box. On the far right of the Embed Link: box, use the Select button to highlight the code. Use CRTL-C to copy the code.

Audio embed screen

To use this code, you will need to Add Media / Widget in your LibGuide in an existing box.

Acquiring Video Embed Code

Display the "item record" for a webcast from the Library's digital collections. Select the Share button to reveal a dialog box. On the far right of the Embed Link: box, use the Select button to highlight the code. Use CRTL-C to copy the code.

Embed video screen

To use this code, you will need to Add Media / Widget in your LibGuide in an existing box.

Add Media/Widget

When embedding audio and video, select Add Media/Widget

Paste the code into the Embed Code box (as illustrated below):

Add Media

 

Now you will need to change the "width" to 100% and remove the height for the video as shown in the screenshot below:

Set width to 100%

Including a Playlist

Embedding Videos in Another Format

Here's an example: https://loc.gov/exhibits/civil-rights-act/multimedia/toni-morrison.html

You will have to paste in coding for the video using this format:

<script type="text/javascript" src="//cdn.loc.gov/loader/player/media.js"></script>
<div class="locmedia-load-this" id="mediaInstance1" style="display:none"><code>{ mediaObjectId: "04ED997509CD0184E0538C93F0280184" }</code></div>

<p><a class="locmedia-player-this" id="player1" rel="mediaInstance1"></a></p>