Adding Videos to Guides

These instructions are specific to YouTube but will generally work with most Internet videos (except university Vimeo videos; see Vimeo for those instructions).

1. On the video's page on YouTube, grab the embed code by clicking Share and then Embed.
   
   
    
2. Remove any width and height so your code looks like:
   <iframe src="https://www.youtube.com/embed/hHIikHJV9fI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    
3. Add a title to the iframe by inserting title=" [video title]" after iframe. This is important for screen readers.
   <iframe title="Secrets of Successful Teamwork" src="https://www.youtube.com/embed/hHIikHJV9fI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    
4. Take the YouTube video widget code and update the relevant information. You can also download and work from the .txt file if easier.
   1. iframe: You will replace this with the updated iframe information you created.
   2. href: This is the link to the video. To get this on YouTube, click Share.
   3. The title of the video with the time entered after it. Adding the time is helpful for students, so they'll know how long watching the video will take.
   4. An abstract / synopsis of the video. Occasionally, the abstract needs to be slightly rewritten to let the user know what the video's about or read better on the page. Read it and edit it if necessary before adding it to your guide.
       
   <div style="--aspect-ratio: 16/9;">
   <iframe title="Secrets of Successful Teamwork" src="https://www.youtube.com/embed/hHIikHJV9fI" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
   </div>
   <div class="video-title">
   <a href="https://youtu.be/hHIikHJV9fI" target="_blank">Secrets Of Successful Teamwork: Insights From Google (04:00)</a></div>
   <div class="video-text">Several years ago, Google launched a big study to figure out what makes teams successful. Watch this video to find out what conclusions the researchers arrived to after studying more than 180 separates teams for the duration of several years.</div>
    
5. On your guide, select Media / Widget from the Add / Reorder option in the box you're adding the video to.
6. In the Widget Name field, enter YouTube: [name of video] [video].
7. In the Embed Code field, enter your code.
8. In the Position drop-down, select in which order this item should display. This is particularly important for mobile view.
   
    
9. Under the Subject Associations tab, select the correct college or site for the content.
   
    
10. Click Save to save your widget to the page.