Note:

If you want to create a new page for developers, you should create it on the Moodle Developer Resource site.

Theme development

From MoodleDocs
Revision as of 07:59, 5 July 2011 by Michael de Raadt (talk | contribs) (Created page with "{{Themes}} This page is a starting point for learning about how to ''develop'' Moodle themes. If you would like to see documentation about installing and using themes, please s...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)


This page is a starting point for learning about how to develop Moodle themes.

If you would like to see documentation about installing and using themes, please see the Themes page in the User docs.

Moodle themes

Moodle has a powerful themes system that allows for a variety of effects through the use of XHTML and CSS.

  • Each page is individually-addressable via CSS, allowing you to pinpoint exact items.
  • Our CSS class naming system uses simple English, is consistent and easily understood.
  • New modules can tell Moodle what styles they need and automatically include these in the stylesheet.
  • Themes can be based on the standard theme, which is very plain but functional. You simply override styles you want to change by adding to the stylesheet in your own theme. This means that if you upgrade Moodle later and new styles are needed, your custom theme will still work without any changes, because the new classes will be defined in the standard theme.
  • Themes can also be based on any other theme. This allows you to easily create families of themes, or variations on a theme. For example you might create a spectrum of pastel shades for use in different courses, but with the same basic layout and logos. You may also want to create a family of differently-coloured themes for accessibility purposes.

Creating your own theme

If you plan to work on your own theme please create a new one (with its own named subfolder) and use Moodle's theme system to base your theme on an existing theme such as standard. If you just modify one of the delivered themes it will be overwritten by the next Moodle update.

See Creating a custom theme and/or Make your own theme and/or Themes 2.0 creating your first theme for some tutorials.

To distribute your theme, zip the theme folder and submit to the Moodle.org Themes database.

Theme Design Limitations: The overall 3 column layout can be customized to some degree, but it needs to maintain the uniformity of the standard Moodle layout.

Theme system changes

Themes have improved a great deal in recent versions of Moodle. If you are using your own theme and want to upgrade, please refer to one of the following:

See also