Embedding YouTube + Eliminate "Flash Player Out-of-Date"

CNM Learn Tricks
for Faculty
06 JULY 2015
Embedding YouTube + Eliminate “Flash Player Out-of-Date”
YouTube videos are popularly included in CNM Learn courses. Sometimes, faculty and students
encounter pesky messages stating “Flash Player is out-of-date” and makes watching these videos
impossible on a computer where you don’t have user permissions to install the new version. There is
a way to fix this and force the video player to load as HTML5, today’s modern web standard.
Embedding a YouTube video is the most efficient
way of sharing videos on web pages, including in
CNM Learn. You don’t need to be a web designer or
developer to do it either!
The scariest part about embedding web content
is the language. HTML is a different language that
uses pieces of English. Not everyone speaks web
languages, but you do not need to. The key to
embedding content is to not feel overwhelmed by
the code. All you need to do is copy and paste.
YouTube provides an embed code for each video
on the site so the videos can be placed into other
websites. A CNM Learn course is a website, so you
can use YouTube videos without any issues.
In the past you may have used the YouTube Mashups
tool included in the CNM Learn Content Editor, but
due to some issues at Blackboard, this functionality
stopped working for an extended period of time.
Embedding YouTube videos is not only a workaround
to issues at Blackboard, but you can customize the
experience for your students so they can play videos
right from the page. Additionally, you can avoid that
annoying “Flash Player Out-of-Date” error that has
a tendency to pop up far too often! Even after you
know for a fact you just updated your Flash Player
plug-in a short time ago! This simple guide will
cover how to embed videos and make your YouTube
content not Flash-player dependent.
An embedded YouTube video in a course
YouTube video <iframe> embed code ready for copying
CNM Learn Tricks for Faculty
s e t t i n g u p yo u r e m b e d c o d e
1. Go to www.youtube.com
2. Search for the video you want to use.
3. Click Share underneath the video. A new panel will
drop down with three options: Share, Embed, and
Email.
4. Click Embed in the new panel.
• The first piece will be a code in a box which begins with
iframe. Clicking Show More will reveal more options.
• Beneath the code box will be a video preview.
• Next is a drop-down menu to pick the video size. The
default 640x360 works very well for CNM Learn.
• If “Show suggested videos when the video finishes” is
checked, uncheck it.
• Leave “Show player controls” and “Show video title and
player actions” checked.
YouTube’s Share/Embed Panel
5. Edit your embed code.
• Locate the section of the code which says ?rel=0
• Change ?rel=0 to read ?html5=1 so that your video is
no longer Flash dependent.
Complete Embedding Options after expanding “Show More”
6. Copy your new embed code.
• It should begin with <i frame width=”640” ... and end
with </iframe>
Above: original code. Below: updated code for non-Flash playback.
Embedding YouTube + Eliminate “Flash Player Out-of-Date” CNM Learn Tricks for Faculty
2
CNM Learn Tricks for Faculty
p l ac i n g e m b e d c o d e i n c o u r s e i t e m
1. Go to the destination course in CNM Learn for the
video.
2. Open Learning Modules and the appropriate
module the video belongs in.
3. Create a new item for the module.
4. In the content editor, click the HTML button to the
far right. A new window will open.
• If you use popup blockers, make sure it does not block
the new window from opening.
Click the HTML button (boxed in red) to open the HTML editor.
5. Paste the embed code you copied from YouTube
in the HTML Editor window. When you have
finished click Update at the bottom.
6. A yellow box will appear in the content editor,
meaning your embedded video has been added.
Now click Submit.
7. Go to Student View and preview the video.
• If you have time, check the video by accessing your
course in a different browser. It is also a good idea to
double check your work so that you know students will
be able to see what you see.
Paste your embed code in the editor and click Update.
Congratulations!
Now you have embedded a non-Flash player
dependent video into your course!
A yellow box means the video was added. Click Submit to finish.
Embedding YouTube + Eliminate “Flash Player Out-of-Date” CNM Learn Tricks for Faculty
3