Headings in Canvas

The Rich Content Editor

Screen shot of rich content editor in Canvas

The rich content editor in Canvas is one tool that you should become very familiar with. These icons above the pages where you add text, allow you to add headings to your page (much like you do in Word), add images, add tables, videos, lists, etc.

Headings

To add structure/improve navigation in a Canvas page you'll use the rich content editor to add headings. The page title is Heading 1, so any section heading in Canvas will begin with Heading 2. To add headings, you simply highlight the line of text, then select the appropriate heading.

Remember, headings exist on their own line -- they help label the info below and should be not complete sentences or paragraphs.

screen cast of adding headings to canvas page using rich content editor

You can check how Canvas page text has been formatted by highlighting or clicking on a section of text (while in edit mode). At the bottom of the editing pane, you will see a p, h2, or h4 appear. These stand for paragraph (normal text, such as this text), heading 2 (section titles), heading 3 (sub-section), or heading 4 (sub-sub section).

Modifying Headings

Unfortunately, modifying headings in Canvas is not as satisfying as modifying headings in Word. Unless you know how to edit the HTML to get the look you want, there are only a few things that you can change, and you'll have to manually adjust them for each heading -- the changes will not apply to all text that has been coded as heading level 2/3/4.

After you've designated text as a heading, you can change the font size, color, and attributes using the tools in the rich content editor.

If you're daring, you can control spacing and add background colors or borders through the HTML Editor. Below is a snippet of code for an example heading that has additional spacing, a border, and background color.

HTML Formatting Fun

<h4 style="font-size: 18pt; font-weight: bold; padding-left: 10px; padding-right: 10px; background-color: #e1ecf1; border-bottom: 3px solid #a9b1c6;">HTML Formatting Fun</h4>

To learn more about formatting text through the HTML editor, check out Formatting Text in Canvas.

Demo Video

Using Heading Tags to Improve Accessibility (3 mins)

A short demonstration from Bellingham Tech on how to use headings in Canvas.

Using Heading Tags to Improve Accessibility