Canvas Guides (en)Canvas GuidesCanvas Instructor Guide Rich Content EditorHow do I embed iFrame videos using the Rich Content Editor as an instructor?

How do I embed iFrame videos using the Rich Content Editor as an instructor?

You can embed iFrame videos in the Rich Content Editor using an external video's direct URL link.

You can also use the HTML embed code in the media player. To locate the embed code, locate the video element that displays the HTML code for the video. Embed codes are commonly found in the video's sharing options.

The Rich Content Editor is used in features that support the editor (Announcements, Assignments, Discussions, Pages, Quizzes, or Syllabus).

Open Rich Content Editor

Open Rich Content Editor

Open the Rich Content Editor using one of the Canvas features that support the Editor.

Open Insert Media Tool

Open Insert Media Tool

Click the Insert/edit Media icon [1].

You can also insert media using the Rich Content Editor menu. Press the Alt+F9 (Windows) or Option+F9 (Mac) keys on your keyboard to open the Rich Content Editor menu. Then click the Insert menu [2] and select the Media option [3].

Note: Media will be inserted at the location of your cursor in the Rich Content Editor.

Insert Using Source URL

Insert Using Source URL

By default, the media window displays the General tab.

To embed the video using a URL, paste the URL in the Source field [1]. The video's dimensions will automatically populate the Dimensions fields [2]. You can also resize the video using the Dimensions fields. To maintain height and width proportions when resizing the video, click the Constrain proportions checkbox [3].

Insert Using Embed Code

Insert Using Embed Code

To embed the video using an embed code, click the Embed tab [1] and paste the code in the text field [2].

When you insert a video with an embed code, the General tab Source and Dimension fields automatically update with information according to the embed code content.

Insert Using Advanced Options

Insert Using Advanced Options

In case a browser doesn't support source video encoding, you can use advanced options to embed your video. Click the Advanced tab [1].

To specify an alternative source for the video, enter the URL in the Alternative source field [2]. Alternative source URLs specify alternative video encoding if a browser doesn't support the initially offered encoding.

To specify a thumbnail image for the video, enter the image URL in the Poster field [3]. If the Poster field is blank, the first frame of the source video will be used as the poster image.

Note: Links from common providers (like YouTube and Vimeo) often link to custom media players and will not recognize any content added to the alternative source and poster options.

Embed Media

Embed Media

To close the media tool and embed your video, click the Ok button.

Preview Video

Preview Video

Preview your video in the Rich Content Editor.

Save Changes

Save Changes

To save changes to your course content, click the Save button.

Note: When using the Rich Content Editor in Assignments, Discussions, Pages, and Quizzes, you have the option to Save & Publish. When using the Rich Content Editor in the Syllabus and Discussions pages, the Save button may appear as “Update Syllabus” or “Post Reply”.