[ARCHIVED] Canvas Theme Inheritance

[jsme_45]

Hi all,

My school has a custom theme with CSS and JS branding uploaded at the account level Theme editor. This was created before I commenced. I'm trying to create a separate theme and custom branding/CSS for subjects within a sub-account.

However, whenever I upload my own CSS file to the Theme editor in the sub-account, my subjects seem to inherit branding (the banner for example) from the account level also. This only seems to happen when I upload CSS to my sub-account theme. Even when I delete the CSS from my sub-account theme, the account-level branding still remains.

Is this just how the Theme Inheritance works in Canvas? Or am I doing something wrong? I would like to create a new theme with CSS and branding separate from what is at the account level.

Thanks in advance.

[jerry_nguyen]

@jsme_45 

Managing themes in Canvas can be tricky. From my understanding, sub-accounts custom JS and CSS will always inherit from root account (e.g. /accounts/1). Thus if you upload a custom css or js file into the sub-account, it can create some issue/glitch as both files from the root account and sub-account are loaded.

If you want to apply custom css/js for a sub-account, you will need to ask your root admin to remove it from the root account and manage custom js/css individually at the sub-account level (E.g. admin will have to re-upload the custom css/js for each sub-account).

If you only need to change the logo or theme colour then you can make a copy of an existing theme by clicking on "+Theme" and select one from the list. Please note, custom css/js will still be inherited from the root account.

[jsme_45]

@jerry_nguyen 

Thanks for the response and helpful advice. I'll ask the root admin to remove my sub-account from the root account. If the sub-account is removed from the root account, does it then become a root account? Is it possible to have multiple root accounts? 

[jerry_nguyen]

@jsme_45 

Sorry if my wording is a bit confusing. 

There is only one root account and it's located at this URL: /accounts/1.

Any other accounts created (E.g /2 onward) will inherit custom CSS/JS from that root /1 account regardless of how you structure it.

E.g. (anything beside /accounts/1 will always inherit custom CSS/JS from it)

1. XYZ University - Headquarter (/accounts/1)
   • Business (accounts/3)
     • Law (/accounts/4)
     • Accounting
   • Art
     • Literature
     • History
     • Design
   • Sport
2. XYZ University - Planet Earth Campus (/accounts/2)
   1. Business
   2. Art
   3. Sport

Thus, to work around without root account admin intervention, you can try to use !important in your custom CSS to override custom CSS rules from your root account

E.g.

header#header {
    padding-right: 0.2px !important;
}

However, anything under the "Edit" tab can be changed for each individual account (Except Login Screen and Watermarks & Other Images (maybe))

[jsme_45]

@jerry_nguyen 

Thanks again. I'm fairly new to Theme development in Canvas so this is very helpful. I may try and use the !important within my CSS to override the root account as you suggested. 

[Peter78]

Your article content is extremely fascinating. I'm extremely intrigued with your post. I desire to get more incredible posts.

official website