Learn@UW - Using Video Embed Code With Insert Stuff

Many online video hosts such as Vimeo and YouTube provide embed code that can be used in conjunction with the "insert stuff" button in Learn@UW to embed the video player in a course page.

Using video embed code in Learn@UW

This article will cover the most basic way to create a new page and add the code.  You can extend the basic technique presented here to edit any exiting page.  Video files will appear on the page at the location of the cursor when you select the insert stuff button.  You can insert multiple videos on the same page or add videos between text etc... 

The first step is to log into Learn@UW.  Then navigate to content where you want to add a course page with remote media. In this example we are adding a new file

create new file


Once the editor loads, name the file and choose the "Insert Stuff" icon from the button bar

insert stuff button location


In the pop up menu select Enter Embed Code.  Then select and copy the code snippet from your video hosting service and paste it in the embed code window.  (Your code may look different than the example image). Always try to use embed code that uses the HTTPS protocol. Using HTTP URLs with embed code will generate security warnings and possibly prevent the embed to load altogether when viewed by students. The code snippet will embed the video file in the page, but the browser loads this data from a remote server, so various security warnings may occur.  


Embed code pasted into code form field



The first time you do this in your course for any URL you may be presented with a message saying "Content Blocked".  If you trust the remote site, you should check the always allow this page button and then click on the "Allow" button for the code to work and not prompt you again. Note that this "Allow" will not take away warnings that are generated if the embed code doesn't use HTTPS.



content blocked warning


You will then see a preview of your file you can play to confirm the proper file is available and working.    When you are ready select the insert button in the lower left corner of the dialogue box. 


Preview page ready to view


you then select refresh which will take you to the preview and another insert button to place the media into the document you were editing. If the remote site is trusted, you will be taken here right after the insert, skipping the steps to allow blocked content in the future.

This is the look of a regular preview, ready to be inserted

Ready to Insert embed code


Once you press insert, you will be taken back to the document itself, where you can continue editing.

code loaded in editor, continue editing



Once you have saved the page confirm the file works through your content menu. 




Keywords:Embedding, streaming, video, email, link, iframe, code, copy, add stuff, vimeo, youtube, mediaspace, kaltura   Doc ID:26379
Owner:Peter B.Group:Learn@UW Utility
Created:2012-09-07 12:05 CDTUpdated:2016-03-01 13:11 CDT
Sites:DoIT Help Desk, DoIT Tech Store, Learn@UW Madison, Learn@UW Utility
Feedback:  1   0