[ARCHIVED] templates -- HTML & CSS

[ellika]

I have a HTML template and CSS style sheet I want to use for a particular content page.  I copied & pasted the HTML in the HTML editor with some success.  How to include the CSS sheet?

[buddyhall · Accepted solution]

Most likely you will need to convert the CSS style sheet into inline style for the page.  This adds more work for you to maintain, but it will ensure your page is styled correctly.  You can check out Inline Styles in CSS (Cascading Style Sheets) for more information on inline styles.

You can also check with your admin to see if they can add the style to the account css override. This will effect everything in Canvas, so you may need to modify your code to only apply to a certain div id.  Keep in mind, that if students are accessing this page through the mobile app, it doesn't use the account stylesheet.

[Stef_retired]

 @ellika ​, have you considered uploading the HTML file to your files area and linking to the file in an <iframe>? Many Canvas users have employed the HTML below with considerable success.

<iframe src="/courses/[YOUR COURSE ID]/files/[YOUR FILE ID]/download" width="100%" height="[WHATEVER WORKS]" data-api-endpoint="https://[YOUR CANVAS DOMAIN]/api/v1/courses/[COURSE ID]/files/[FILE ID]" data-api-returntype="File"></iframe>