[ARCHIVED] Tabs

Jump to solution
rcrichards
Community Member

I've seen syllabi with tabs on Canvas. I want to organize my syllabus with tabs. How do I do that? Here's a screenshot of a syllabus with tabs:

284746_pastedImage_1.jpg

Labels (2)
1 Solution
kmeeusen
Community Champion

Hi  @rcrichards 

This can be accomplished using HTML code, and the HTML Editor in the Syllabus Description area. Here is a code snippet that will work for this purpose.

<div class="enhanceable_content tabs">
<ul>
<li><a href="#fragment-1">PUT TITLE FOR TAB HERE</a></li>
<li><a href="#fragment-2">PUT TITLE FOR TAB HERE</a></li>
<li><a href="#fragment-3">PUT TITLE FOR TAB HERE</a></li>
</ul>
<div id="fragment-1">PUT THE CONTENT FOR THE FIRST TAB HERE</div>
<div id="fragment-2">PUT THE CONTENT FOR THE SECOND TAB HERE.</div>
<div id="fragment-3">PUT THE CONTENT FOR THE THIRD TAB HERE</div>
</div>

Disclaimer: Canvas keeps threatening to deprecate this code, but it's been two or more years, an nothing yet.

This can also be accomplished with some third-party authoring tools that work with Canvas.

We have a full Canvas classroom of various HTML snippets that are easy to learn and easy to use that Instructure let us create called CanvasHacks Demo Course. If you would like to be added to the actual Canvas classroom, shoot me your email via DM, and I will hook you up. You can be added as either a teacher of a student.

Kelley

View solution in original post