Canvas Guidance for ECU’s Syllabus

 

Canvas Template Previews

Preview the two ECU-aligned Canvas page layouts below. Copy options, HTML templates, and step-by-step tutorials are available in the accordions that follow.

Official Syllabus

Canvas preview of the Official Syllabus template, including a purple Official Syllabus heading and a link to the ECU Syllabus Site.

Section-Specific Information

Canvas preview of the Section-Specific Information template, including a purple page heading and organized section headings for course-specific information.

Copy Options and HTML Templates

If you do not want to use HTML, copy and paste the following text into the Canvas Rich Content Editor. Apply a Heading 2 style to Official Syllabus, and confirm that the ECU Syllabus Site text remains linked.

Official Syllabus

For this course’s official syllabus, visit the ECU Syllabus Site, search for this course and section, and select View Syllabus to download the official syllabus.

Copy the entire code block, including the opening and closing tags.

<div style="width: 100%; color: #212121; font-family: Arial, Helvetica, sans-serif; line-height: 1.6;"> <h2 style="width: 100%; margin: 0 0 16px 0; padding: 14px 18px; background-color: #320456; color: #ffffff; font-size: 1.6rem; line-height: 1.3;">Official Syllabus</h2> <p style="margin: 0;">For this course&rsquo;s official syllabus, visit the <a style="color: #4f2683; text-decoration: underline;" href="https://syllabus.ecu.edu" target="_blank" rel="noopener noreferrer" aria-label="ECU Syllabus Site, opens in a new tab">ECU Syllabus Site</a>, search for this course and section, and select <strong>View Syllabus</strong> to download the official syllabus.</p> </div>

Preview of the Official Syllabus template in Canvas

Canvas Syllabus page preview showing the Official Syllabus purple header and ECU Syllabus Site link.

If you wish to create a Canvas page titled Section-Specific Information, paste this second template into that page’s HTML Editor, then replace the example Lorem Ipsum content with the information students need.

<div style="width: 100%; color: #212121; font-family: Arial, Helvetica, sans-serif; line-height: 1.6;"> <h2 style="width: 100%; margin: 0 0 16px 0; padding: 14px 18px; background-color: #320456; color: #ffffff; font-size: 1.6rem; line-height: 1.3;">Section-Specific Information</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. This page contains information specific to this instructor, course section, modality, and semester.</p> <h3 style="color: #320456; border-bottom: 2px solid #d8cbe3;">Instructor Information</h3> <p><strong>Instructor:</strong> Lorem Ipsum</p> <p><strong>Email:</strong> lorem.ipsum@example.edu</p> <p><strong>Office:</strong> Lorem Hall 000</p> <p><strong>Office hours:</strong> Lorem ipsum dolor sit amet.</p> <h3 style="color: #320456; border-bottom: 2px solid #d8cbe3;">Course Schedule</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <h3 style="color: #320456; border-bottom: 2px solid #d8cbe3;">Materials and Technology</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <h3 style="color: #320456; border-bottom: 2px solid #d8cbe3;">Course Expectations</h3> <h4 style="color: #4f2683;">Communication and Participation</h4> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <h4 style="color: #4f2683;">Academic Integrity and AI Use</h4> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <h4 style="color: #4f2683;">Classroom or Online Conduct</h4> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> <h3 style="color: #320456; border-bottom: 2px solid #d8cbe3;">Accessibility and Student Support</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> </div>

Preview of the Section-Specific Information template in Canvas

Canvas page preview showing the Section-Specific Information header, branded subheadings, and example content.

Canvas Tutorials

Copy HTML template 1 from the previous section, including its opening and closing tags. Then complete these steps in the Canvas course where the official-syllabus link should appear.

  1. Open the Syllabus page. In Course Navigation, select Syllabus.
  2. Select Edit. This opens the Canvas Rich Content Editor for the native Syllabus page.

Canvas course interface showing the Syllabus link in Course Navigation and the Edit button on the Syllabus page for steps 1 and 2.

  1. Open the HTML Editor. At the bottom-right of the Rich Content Editor, select the </> icon.
  2. Paste the template. Paste the complete Official Syllabus HTML template into the HTML Editor. Select the </> icon again if you want to preview the formatted content in the visual editor.

Canvas Rich Content Editor showing the HTML Editor toggle used to switch to HTML view and paste the Official Syllabus template for steps 3 and 4.

  1. Update the Syllabus page. Select Update Syllabus to save the official-syllabus header, statement, and link.

Canvas Syllabus editor showing the Update Syllabus button used to save the completed page in step 5.

Important: The native Canvas Syllabus page should contain only the official-syllabus link. Do not add section-specific content to this page.

Create and publish a separate Canvas page for information that is specific to your course section.

  1. Open Pages. In Course Navigation, select Pages.
  2. Create a new page. Select + Page.
  3. Name the page. Enter Section Specific Information in the Page Title field.

Canvas course interface showing Pages in Course Navigation, the Add Page button, and Section Specific Information entered as the page title for steps 1 through 3.

  1. Open the HTML Editor. In the Rich Content Editor, select the </> icon at the bottom-right.
  2. Paste HTML template 2. Paste the complete Section-Specific Information template into the HTML Editor.
  3. Return to the visual editor. Select the </> icon again. Replace the sample text with the section details students need and remove any headings that do not apply.

Canvas Rich Content Editor showing the HTML Editor toggle and pasted Section-Specific Information template code for steps 4 through 6.

  1. Save the page. Select Save, or Save & Publish if the page is ready for students. Place the published page in a prominent course location—such as the first module—so students can find it by the first day of class.

Canvas page editor showing the Save controls used to save or publish the Section-Specific Information page in step 7.

Suggested organization: Use clear headings and short sections. The page can serve as a landing page that points students to the course calendar, modules, assignments, tools, policies, and support resources located elsewhere in Canvas.

  • Confirm that the ECU Syllabus Site link opens correctly.
  • Confirm that the course and section can be located on the Syllabus Site.
  • Confirm that the native Canvas Syllabus page contains only the official-syllabus link.
  • Replace all Lorem Ipsum example content on the Section-Specific Information page.
  • Publish the Section-Specific Information page and link it from a prominent course location.
  • Verify that all student-facing details are available in Canvas by the first day of class.
  • Use Student View to confirm that headings, links, and section information display as intended.