Hello there! Is everyone here knows how to change the fonts properties of the title in a Canvas page?

Jump to solution
edutech_is01
Community Explorer
1 Solution
James
Community Champion

 @edutech_is01  

The way to change font properties is to find a CSS selector that can identify the element that you need to change and then upload some custom global CSS to your theme. This lesson from the Canvas Admin Guide explains how to upload the files: How do I upload custom JavaScript and CSS files to an account? 

This means that the changes will occur for an entire account or subaccount, depending on where you upload the custom file. There is not a way for a non-admin user to modify the CSS properties for the title or for a single course.

The title that displays on a page is usually marked up using the H1 heading element.

If you are referring to user content pages only, then H1 element has a class of "page-title" on it, so a CSS selector could be h1.page-title.  There is only one other place in the source code that refers to page-title as a class, so if you want to make sure that it only occurs on content pages and not LTI messages (the other place this appears), then you could use a CSS selector of #wiki_page_show h1.page-title.

If you need to modify content for just one or two courses, you still need to modify the global custom CSS but there are classes on the body that allow you to select specific courses. For example, if your course ID is 2687822, then there is a class of context-course_2687822 on the body element. You could use .context-course_2687822 #wiki_page_show h1.page-title to select the titles in just that course.

You can list more than one selector, separated by commas, for a CSS definition. This means that if there are 2 or 3 courses that need the changes, you could define them all at once.

If you are self-hosting Canvas, then you could modify the source code to change the CSS definitions. Either way, if you are not a Canvas admin, then you would need to talk to your Canvas admin to get anything done.

View solution in original post