Saturday, 18 September 2010

How to add a YouTube video (Students)

This lesson demonstrates how to embed a YouTube video into your Unit or Course.

Overview

Overview.png

YouTube videos can be added anywhere that uses the HTML Edit box. This is why it is so important to use Firefox and not Safari as Safari doesn't give you the editing features needed.

The picture above is of the HTML Editing Box. You can add videos in the Message Boards, Online Text Assignments, Blogs and any area where the HTML box appears.

Find the Video

Find_the_Video.png

First of all, visit YouTube and find the video you want. On the right hand side you will see the Embed Code.

Click on Embed Box and copy the code.

Notice the icon on the right hand side...

Customise the Player

Customise_the_Player.png

Clicking on this icon will allow you to customise your player - choose a colour, related videos and change the size.

This is not essential but if you know what you're doing then feel free to customise!

You will need to copy the code again once you have made your changes.

Back to the Editor

Back_to_the_Editor.png

Return to the Edit Box and click on the Toggle HTML Code icon as highlighted above. This will convert the current editor into a code based editor.

HTML Editor

HTML_Editor.png

The previous text is now converted into HTML meaning that it has the necessary code to show fonts, size, colours and line breaks (shown by the <br /> code.

Simply paste the Embed Code you copied from YouTube after this code!

Pasting the Code

Pasting_the_Code.png

Once you've pasted in the code, simply click back on the Toggle HTML Editor icon (highlighted) to return to the normal view.

But I can't see the Video!

But_I_can_t_see_the_Video_.png

Quite often when you go back to the normal view the video wont be there. But I can promise you it is! The best thing to do is to click on the icon above which launches the external editor.

Ahhh there it is!

Ahhh_there_it_is_.png

Once you do that you'll see that the video is indeed in place. You can then edit this resource some more by adding images, text and weblinks in the usual way.

If you want to add another video, follow the steps above and paste in the Embed code.

Then simply close this window and save your entry!

No comments: