Style sheet

When a new school account is created, it's given a default CSS file. As the school administrator, you can customise this file in order to change a wide range of graphical properties of your school's Class Calendar pages. You can update this modified CSS file at any time, using your school administrator account.

This page provides an overview of CSS customisation. The developer resources listed below provide technical details, together with a simple CSS test framework.

Class Calendar page structure is primarily controlled by HTML table elements. These table structures control things like overall layout and text spacing. The look and feel of major tables and table elements is controlled by the CSS file.

The text properties of Class Calendar pages are controlled by HTML span elements. The pages use a substantial number of different span classes and subclasses. Each of these can be modified in the CSS file. A number of other visual elements can be controlled by the CSS file, including document background, hyperlink behaviour and list element separators.

You can include your own HTML text in Class Calendar - for example, for course descriptions, the "about the school" description, and terms and conditions. These elements are controlled by the same CSS file. You can choose to use the existing CSS classes to set the look and feel of these elements, or add your own classes.

The development of a customised CSS file should proceed as follows:

• Start by downloading the default style sheet, accessories and instructions in the developer pack, below.

• Experiment with new CSS settings using a programmer's editor. (It's a good idea to take a copy of the default CSS file before editing it.) Test these new settings against the static HTML provided in the developer pack.

• Validate your modified CSS file using the W3C validation service.

• When you are satisfied with your new CSS file, you can upload it to Class Calendar in the school's School details > Graphics section of your Class Calendar account.

Contains the default CSS file, sample static HTML pages (taken from the live Class Calendar system), a sampler HTML page using all span classes, and details of the CSS file structure.

CC_CSS_DevPack_v05.zip (57 KB)

For further technical information and support, contact:

Email:

support@classcalendar.biz

Phone:

+ 44 (0) 1273 680 806