Last modified 4/16/2011.
This document refers to versions of CourseForum and ProjectForum prior to version 7. For newer versions, see the newer themes HOWTO.
This document describes how you can create and install new themes, augmenting those already bundled with CourseForum and ProjectForum. For examples, see the theme exchange.
Both CourseForum and ProjectForum (full versions only) offer a choice of themes, allowing administrators to radically change the appearance of the entire site or an individual forum. Both products ship with several themes already installed, and themes can be selected via the site or forum administration interfaces.
Besides the themes shipped with the products, new themes can be added to the available choices. Themes can be created so that CourseForum or ProjectForum sites are branded to match other web sites or institutional materials. Themes can be created also simply to match personal preferences.
Creating new themes requires an understanding of conventional web design techniques, including use of HTML and Cascading Style Sheets (CSS). Programming expertise is not required.
If you need assistance with these changes, or have particular needs that cannot be met through the customizations described here, please contact us to discuss your situation. If you would rather not do the work to create a new theme yourself, we can do this for you on a contract basis.
Starting with version 4.3, creating and modifying themes is done entirely via the web-based administration interface, in the "Custom Themes" section. You can create a new theme (starting with an existing theme), or modify any of the theme components (changing styles, adding or deleting images, etc.).
Our theme exchange contains images and downloads of several different themes, for inspiration or to try. If you've created an interesting looking theme and want to share it with others, please let us know.
Themes can contain a number of different types of components: CSS style sheets, images, HTML includes, and metadata, which can all be modified via the web-based theme editor.
CSS style sheets [styles.css, print.css]. Style sheets allow you to change the fonts, colors, and positioning of elements on the page. All pages automatically load in a main stylesheet, which you will want to customize. Simple changes can involve setting colors, fonts, adding images, etc. More complex changes can radically adjust the appearance of the site, whether different components are displayed, where they are located, etc. The sidebar describes some of the main styles that you may be interested in modifying.
A second stylesheet can also be provided, which will be loaded on the 'Print' pages after the main stylesheet. This can be used to adjust the appearance of the print pages slightly; see the 'Broadcast' theme for an example.
Images [home.gif, help.gif, edit.gif, post.gif, ...]. You can replace the various GIF images that are used throughout the software with your own images. You can also add your own images (e.g. a corporate logo), which would need to be referenced from the main stylesheet.
HTML includes [pagetop, pagebottom, contentend]. You can insert arbitrary new HTML code into pages by including any of these three HTML includes in your theme. You can use these for example to add header and footer areas to all pages. The HTML is inserted immediately after the initial <body> tag, immediately before the closing </body> tag, or right after the main content of the page, respectively.
Metadata [info.txt]. The theme also contains other metadata, such as the name of the theme, the size to use for dialog windows (e.g. attach file), the size to use for help windows, and the number of columns and rows in the textarea used for 'post your comments'. The theme editor presents each of these as options.
Themes are created and modified using the web-based theme editor, so there is little reason to be concerned about how they are stored on disk. However, if you want to share your theme with someone else, or you are using a version of CourseForum or ProjectForum prior to version 4.3, this may be useful.
Themes are stored in the "themes" directory within the "Group Data" or "Course Data" directory. Each theme gets its own directory within that, and that directory will contain the theme files (styles.css, etc.). If the theme does not provide a particular file, the file from the default theme will be used in its place.
To make it easier to share themes, all the components of a theme can also be packaged into a single ".zip" file (created using zip, winzip, or other utilities). The ".zip" file can then be placed directly into the "themes" directory. Several such files are available for download on the theme exchange.