Embedding a YouTube video

Instructions for embedding a YouTube video on your MU Extension page

After determining that the video follows all the content guidelines and is suitable for embedding on an MU Extension page, here are the steps:

  1. Go to the video on YouTube.com site. If you are looking at it as an embedded video on a news release, click on the YouTube icon on the lower right edge to open it in another window on the YouTube.com site.
     
  2. Click “Share”  below the video , click “Embed” and “Show more”

    screenshot of a YouTube video page showing where to click to configure embedding
  3. Scroll down to the option that appear below the video preview.
     
  4. In the Video size option, put 360 in the first box. The second box will be calculated for you when you click in it.  This keeps the aspect ratio of the video correct so it doesn’t appear squished or stretched.
     
  5. The rest of the options should be marked as follows:
    No check in "Show suggested videos when the video finishes"
    Check in "Show player controls"
    Check in "Show video title and player actions"
    Check in "Enable privacy-enhanced mode"

    It’s important not to mark “Show suggested videos…” because this adds links to videos that may not be appropriate for all audiences.
     
  6. Triple-click in the box where the code appears (it should start with <iframe…
    this will highlight everything in the box. Hit ctrl-C to copy it.

    screenshot of the embed code for a YouTube video
     
  7. Go to WebTool and open the page where you want to place the video.
     
  8. In the Web content tab (page editor), put your cursor where you want the video to go. Type something like VIDEO (this is temporary)
     
  9. Switch to the Source view of your page
     
  10. Look for what you typed (VIDEO) and highlight the word. Paste the code that you copied from the YouTube site.

    How it looks before you paste the code:
    screenshot of the page source code before you paste the embed code.

    Now paste the code and it will look like this:
    screenshot of page source after pasting the embedding code

     
  11. Switch back to the display view (click on Source again).  You will NOT see the video here. You will just see a blank space. Save your page. Open it in the browser to see if it displays correctly.
     

If you have any trouble with this process, contact a member of the Web team for assistance.