Creating Dynamic Course Content in Canvas with Rich Content Editor
Canvas has a simple, yet powerful, content editor that is available anytime for creating new content. The Rich Content Editor can be found anywhere in Canvas where an instructor or student might want to enter text or other content (Announcements, Assignments, Discussions, Pages, Quizzes, or Syllabus).
Using the Rich Content Editor you can not only create formatted text, but also add tables, images, video content, math formulae, and other rich media.
Parts of the Rich Content Editor
Click image to see a larger version of the screenshot.
Sidebar [A]
The RCE hides the right sidebar (content selector) by default, giving you more editing space to work with your document. It will show as a temporary fly-out menu when necessary. An example screenshot of this appears under “Options Button” below. You can close the fly-out menu when it appears with the X in its top right corner when you are done with it.
Menus [B]
There are menus above the toolbar where you can find the all features available in the RCE. Previously some options were only available by keyboard inputs or were hidden. A few lesser-used features are only available in the menus and not the toolbar, and some users prefer menus over toolbars.
Toolbar [C]
The buttons on the toolbar are condensed and grouped by related function. Click the down arrow next to buttons [1] to see the full list of choices, or just click the button for the first one.
Integrations [D]
The buttons for Panopto and Office 365 are top-level buttons in the RCE. Additional integrations are available by clicking the Apps button [2]. Click View All to see a list of available integrations and click on the title from the menu that pops up to select it. The RCE may place recently used integrations in a short quick-list under the plugin button.
Condensed Toolbar [E]
If your screen is too narrow to show the entire toolbar, Canvas will compact some of the items into a More button at the end of the toolbar. Click the More button to see the rest of them.
Status Bar [F]
The status bar under the menu has been improved and is easier to read. Here you can find Raw HTML Editor mode [4] and the Accessibility Checker [3], as well as a Keyboard Shortcuts reminder, and a button to go Fullscreen [5] so you can focus on your content. (Press escape to exit fullscreen mode.) The handle in the bottom right corner to resize the editing window is also now more noticeable.
Options Button
Once you have inserted an image (or link, table, and so on), click on it to reveal an options button for it. Clicking on this button will open the right fly-out to set options for that item. These buttons can appear above or below the item depending on where there is space available for the button to appear. Click the X in the top right corner of the fly-out to close it.
This screenshot shows the cursor pointing at the options button for an image (labeled “Image Options”), and the fly-out menu on the right.
Click image to see a larger version of the screenshot.
Instead of an options button, a table has a toolbar of table editing buttons, allowing for easy access to commands such as “insert new row below”.
Click image to see a larger version of the screenshot.
Additional Features
MathJax
MathJax is now available throughout much of Canvas, which works in conjunction its existing LaTeX math editor. This allows you to include math notation in places where it was previously not possible, and is friendlier for accessibility. Formula input is still done by LaTeX, but Canvas will use MathJax to render it to viewers. Links to documentation for MathJax are in the documentation section below.
YouTube Integration
There is now an integration for YouTube enabled in Canvas, available both in the RCE as well as part of the modules page. In the RCE, click the Apps button to find it (see “Integrations”, above) and select YouTube from the menu. In the YouTube screen that appears, you can search for the video you want in your document and press return/enter on your keyboard. Select the desired video from your results and click embed. You may also click the down arrow to choose a size for embedding the video player (see screenshot below). If you already know the video you want, paste the URL in the search and it should be one of the first results. If you want to embed an unlisted video that search does not find (or a video from another service, such as Vimeo), you will need to use the Embed Code button that appears as a cloud at the end of the toolbar (seen in “Condensed Toolbar”, above).
We recommend you directly embed YouTube videos using the integration if possible for the best viewing experience. As an alternative, you can just paste the link in to the editor area (not using the link tool, but just paste it) and Canvas will generate a preview automatically.
See the end of this page for a comparison of the ways that a YouTube video can be integrated to the RCE and how each appears once the page is saved.
To use the YouTube integration from the modules page, add an item to a module and choose type External Tool. Choose YouTube from the list.
Enabling the New Rich Content Editor Early
The related new features (MathJax and YouTube) may not be active until their later rollout, but the rest of the changes and features are already available. To enable the new RCE, follow these directions and refer to the screenshot below them.
- Go to your course.
- Click on Settings at the end of your course navigation menu [1].
- Change to the Feature Options tab [2].
- Click on the switch for RCE Enhancements [3]. It will be green and have a check mark if enabled.
- These options save automatically. There is no save button.
Click image to see a larger version of the screenshot.
Documentation and Learning About New RCE
- Guides for Instructors
- Guides for Students
- MathJax is a very recent feature and is still being implemented as this document is written. As such, no documentation is yet available. It is partially-implemented and still developing. In general, use the existing math editor in the RCE to create your notation and save the page. While viewing a page with such notation, the reader can right click on it for MathJax and accessibility options.
- Read the announcement about the introduction of MathJax. There is also discussion (including developer and Canvas replies) in the comments.
- The start of MathJax deployment is discussed in the November deploy notes.
- MathJax outside of the RCE and some implementation details are temporarily delayed until January according to the December deploy notes.
YouTube Embed Examples
Shows examples for the different ways YouTube can be used in the Canvas RCE.
Method |
Example |
| Just paste the link in the editor. | https://www.youtube.com/watch?v=bVGvZkbJ97I |
| Use Links toolbar button. | (whatever text you type appears here) |
| Embed with YouTube integration. | |
| Embed with YouTube integration (return link). | Diversity Digest: Anti-Black Racism Course |
| Use Embed Code |
Rich Content Editor Help for Instructors
Text Editing and Linking
- How do I add and modify text in the Rich Content Editor as an instructor?
- How do I create a hyperlink in the Rich Content Editor as an instructor?
- How do I create a hyperlink from Microsoft Office 365 in the Rich Content Editor as an instructor?
- How do I insert links to course content into the Rich Content Editor using the Content Selector?
- How do I insert course files into the Rich Content Editor using the Content Selector?
- How do I insert a table using the Rich Content Editor as an instructor?
Images and Multimedia
- How do I embed images from Canvas into the Rich Content Editor as an instructor?
- How do I embed images from the web in the Rich Content Editor as an instructor?
- How do I link to a YouTube video in the Rich Content Editor as an instructor?
- How do I upload a video using the Rich Content Editor as an instructor?
- How do I record a video using the Rich Content Editor as an instructor?
- How do I add captions to new or uploaded videos in Canvas as an instructor?
- How do I view captions in a video as an instructor?
Other RCE Tools
- How do I use the Accessibility Checker in the Rich Content Editor as an instructor?
- How do I use the HTML view in the Rich Content Editor as an instructor?
- How do I use the Math Editor in the Rich Content Editor as an instructor?
Rich Content Editor Help for Students
- How do I add and modify text in the Rich Content Editor as a student?
- How do I use the HTML view in the Rich Content Editor as a student?
- How do I embed images from Canvas into the Rich Content Editor as a student?
- How do I embed images from the web in the Rich Content Editor as a student?
- How do I create a hyperlink in the Rich Content Editor as a student?
- How do I create a hyperlink from Microsoft Office 365 in the Rich Content Editor as a student?
- How do I record a video using the Rich Content Editor as a student?
- How do I upload a video using the Rich Content Editor as a student?
- How do I record audio using the Rich Content Editor as a student?
- How do I add captions to new or uploaded videos in Canvas as a student?
- How do I view captions in a video as a student?