In the Site Settings section, there is a tab labeled "Advanced" where you can control a few additional aspects of your site that we do not recommend for beginners. People who are well-versed in website management, programming or just know their way around HTML/CSS will feel right at home.

There is a code block in the Advanced tab where you can add customized CSS to your site. We load your code at the very end of the header so it will override previous style definitions for the elements you declare, unless there are some inline rules on that element, but we try to avoid that whenever we can.

We use the ACE editor which will give you an interface like this one:

ACE provides inline error detection which is frequently helpful for catching mistakes, but can sometimes be a little over-zealous about its strict adherence to the "rules." (So if you see a warning icon but your code works, don't worry about it.)

An easy example of a frequent change groups make is to change the color of the navigation bar in the Springfield theme. The code in the above screenshot will change the default navbar from a grey/blue to black:

Our front end frameworks are always maturing and some themes currently use Bootstrap 3 while others use homegrown frameworks. As a result, make sure you check your customizations if you change themes.

There are 3 important global classes we use to implement default school themes:

These represent the color scheme from each school's official color palette. There are other manifestations of these classes, like primary-bg which applies the primary color to a background or btn-primary which does the same to an HTML button element. These helper classes are defined for secondary and tertiary as well. You may override them, but know that the changes are global across your site and will affect numerous elements. We suggest using more specific selectors to isolate your changes to specific areas.