Look and feel

Each plugin can be provided with its own /styles.css script to customise that plugin's look and feel. Over and above that, Moodle provides a flexible plugin-based theming framework--check out the Moodle directory at https://docs.moodle.org/dev/Themes. A new Moodle theme is possibly one of the more complicated plugin types you might need to develop. Go to Eclipse and navigate the PHP Explorer to the theme folder:

The trick to developing a new Moodle theme is to take a pre-existing theme and modify it to your requirements. Take a look in the Moodle plugins directory (https://moodle.org/plugins/browse.php?list=category&id=3) for third-party themes.

Let's take a look at the general structure of a Moodle theme plugin. In Eclipse, open the theme/canvas folder:

In the previous screenshot, you will see two folders that have been expanded: layout and style. Double-click on the config.php file to look at the structure. The code comments in config.php are self-explanatory. Particular attention needs to be paid to which style sheets and which layouts are loaded in which contexts. For example, let's take a look at the theme layouts:

The entry for "course" specifies that the structure of a course page will be created using the general.php file. Take a look at https://docs.moodle.org/dev/Themes_overview#Layout_files for more information.

Let's open the general.php file now and take a look inside. Essentially, you will see the page header, page content, and finally the footer being sent to the output as a mixture of HTML and echoed PHP. Change the page structure specified in this file and you change the page structure for the page types specified by the $THEME->layouts array.

We will be investigating the development of Moodle themes much more fully in Chapter 8, Creating a New Skin.