Customising/Themes/1.1

From Mahara Wiki
Jump to: navigation, search

Mahara 1.1 reads theme configuration files from htdocs/theme//config.php. The basic Mahara 1.1 release come with only one theme installed, called 'default', but if other theme directories are placed under htdocs/theme, with a config.php, they will appear on the Site Options page in the Admin section.

Templates are stored in htdocs/theme//templates, stylesheets are stored in htdocs/theme//static/style, and images in htdocs/theme//static/images.

The directory structure under htdocs/theme//templates mostly mirrors the structure of the php pages on the site, so for example, the page template used on the page htdocs/admin/site/options.php is found in htdocs/theme/default/templates/admin/site/options.tpl.  However this is not a strict rule; some pages in different folders may share a template, and some templates don't belong to a particular page, but are included by other templates.

Plugin directories contain templates which are used only by that plugin.  For example, the "My Files" page is in the file artefact plugin at htdocs/artefact/file/index.php and its template is in htdocs/artefact/file/theme/default/index.tpl.

In 1.1, plugins don't generally contain css and images, which are stored under the core theme directory. In 1.2 this has changed, so that css and images are stored with the plugin.

Creating a new theme for Mahara 1.1

If you are considering putting a lot of effort into a new theme for Mahara 1.1, you should be aware that 1.1 themes will not work on 1.2 without significant modification.  If you think your site will be moving to 1.2 soon, you may want to consider delaying your theme development until then.

(copied from http://mahara.org/interaction/forum/topic.php?id=898):

Create a new directory in the theme/ subdirectory (e.g. theme/ponies/ or similar)

Copy the config.php from the default theme directory to your new directory

Edit your config.php, remove the $theme->formrenderer line, and add a new line: $theme->parent = 'default';

From then on, you will have created a new theme that inherits from the default theme. What this means is, when Mahara needs a theme file (image, CSS file or template), it will look for it in your theme's directory, and if it can't find it there it will use the one in default/.

This means you can create e.g. the static/images directory, and put a logo.gif in it, and this will change the site logo

You can do the same with static/style/*.css - those stylesheets will be included on the page after the parent theme's ones, so you just need to override rules you want to change. Unfortunately the default css has quite a bit of !important in it (all removed in 1.2), which will make the process a bit more annoying than it has to be.

Hope that's enough to get you started!

We hope that in most cases, theme authors won't need to create new templates, or copy templates from "default" into their themes; a lot of the work can be done just by overriding default styles in the new theme's  stylesheet.