omniupdate user's guide at MtSAC

Embedding Video Media

With OmniUpdate we are enabling the embedding of streaming video into web pages that are managed with OmniUpdate. Embedding is enabled on request

Intellectual Property, Fair Use & Copyright Law

"Publishing copyrighted material without the consent of the owner on District Web sites in violation of copyright laws." - FHDA Educational Technology Advisory Committee (ETAC) Procedures Regarding Misuse of Computer Information AP 3250.

Fair Use is not a law. It is a set of guidelines intended to help protect you from lawsuits in case a legal issue arises; you may be held personally liable by the copyright owner.

More details on your responsibilities and liabilities concerning intellectual property, Fair Use and copyright law can be found at De Anza's Distance Learning.

Section 508 - Accessibility

Faculty and staff must support the College District's compliance with Section 508, which is part of the federal law known as the Rehabilitation Act of 1973. The primary impact on video content is the requirement for captioning. More details can be found at the ETS District web site:

Hosting Limitations and Options

MTSAC's main web servers are not capable of serving sustained and simultaneous video streams, so hosting of video files on the web server is not encouraged. There are three alternative video hosting options:

MTSAC has a dedicated video streaming server. Faculty and staff can arrange with the Web Team to have video files hosted on the server. Here's an example of a hosted Quicktime file.
De Anza has an Apple iTunes U store that presently hosts content for a number of courses from Biology, Heath & Environmental Studies, Language Arts, Intercultural/International Studies,and other departments. The course content is visible only after a login and is hidden from public view.
Faculty may host video content with companies like YouTube and Vimeo.

Example - Embedding a YouTube Video

The following how-to demonstrates the embedding of this YouTube video:

http://www.youtube.com/watch?v=sSWKYOvy4QI

This procedure should also work for many other hosting sites, such as Vimeo.

Video file formats supported by OmniUpdate for embedding are Flash, Quicktime, Windows Media and Real Media. Another proprietary format named Transcode-It is also allowed, but is only available for OmniUpdate administrators.

Two pieces of information are needed to embed a YouTube video into an OmniIUpdate page:

The embed URL of the video - this is not the same as the URL shown above.
The dimensions of the video - width and height.

You will be shown how to obtain this information in the following steps.

Preparation: A web page to hold the embedded video should already be open in OmniUpdate in the edit mode.

If you have been approved to embed video, the "Insert / edit embedded media" tool icon should appear in your toolbar. It looks like a vertical strip of rectangular film frames. If you do not see this embed video tool icon in the editor, contact the Web Team to have the embed tool enabled. You will be asked for the pages or directories to set up with permission to embed video. Do not bother to proceed with the rest of the how-to until the embed video tool is enabled.

In another browser window, navigate to the YouTube video to be embedded.

Obtaining the Embed Code: Locate the Embed option button - on YouTube, this is located below the lower right corner of the video display.

The Vimeo embed icon appears at the right side of the video display when the page is loaded, and afterwards when the cursor is moved over the display area.

Clicking on the embed icon opens the embed dialog.

For YouTube (with Privacy Mode enabled):
YouTube embed dialog

For Vimeo (partial view):
Vimeo embed dialog - partial view

In the pictures above, the "embed code" is the line of HTML code that begins with "<object width= ...' . You will need to copy & paste the embed code into a text editor or other handy temporary location. Since you already have the destination web page open in OmniUpdate, you could paste it into the main area of the page - you'll be deleting it later.

Before you copy the embed code, set any options that will improve the experience for visitors to your web page. I've chosen "Enable privacy-enhanced mode" so that YouTube does not set tracking cookies on the visitor's browser. The width is chosen to be less that the 600 pixel width of the main content area of a MTSAC web page.

Here's the pasted total embed code from the YouTube video, with the information you need highlighted:

The repetition of the information comes from the need of the embed code to work in different browsers.

Key Embedding Information: For this video, the key information is:

Embed URL: http://www.youtube-nocookie.com/v/sSWKYOvy4QI
Width: 480 (pixels)
Height: 385 (pixels)

Please note that the entire URL from the embed code is not used, only the portion starting with http:// to the first & (ampersand) symbol.

insert / edit embedded media tool icon The "Insert / edit embedded media" Tool: The "Insert / edit embedded media" tool icon looks like a vertical strip of rectangular film frames. Selecting the embed tool will bring up the embed media dialog window.

embed tool dialog window

For YouTube and Vimeo, the Type is Flash.For the Dimensions, the box for the width value is on the left and the right-hand box is for height. Enter the values as they are defined in the embed text you obtained earlier. Be sure to check the Contrain proportions checkbox - that will allow you to change the size of the embedded video without distorting the proportions.

For File/URL, enter the Embed URL you obtained earlier.

Choose Insert to complete the embedding of the video.

When you are finished, you will have an embedded video that you can test in the Preview mode before publishing.

Cleanup: Don't forget to clean up any embed code you may have pasted into the page - this should be very obvious and hard to miss!