Note: You are currently viewing documentation for Moodle 3.7. Up-to-date documentation for the latest stable version of Moodle may be available here: Themes 2.0 how to clone a Moodle 2.0 theme.

Development:Themes 2.0 how to clone a Moodle 2.0 theme: Difference between revisions

From MoodleDocs
Line 26: Line 26:
==Re-naming some elements==
==Re-naming some elements==


The problem when '''cloning''' a theme is that you need to rename all those instances where the theme name, in this case'''boxxie''', occurs. The first place to look, as mentioned above, is '''lang/en/theme_boxxie.php'''. This file, as well as needing to be renamed, also needs some of its content renaming too. So before we forget, let's '''right click''' on this file and '''rename''' it '''theme_foxxie.php''' before we open it.  
The problem when '''cloning''' a theme is that you need to rename all those instances where the theme name, in this case '''boxxie''', occurs. The first place to look, as mentioned above, is '''lang/en/theme_boxxie.php'''. This file, as well as needing to be renamed, also needs some of its content renaming too. So before we forget, let's '''right click''' on this file and '''rename''' it '''theme_foxxie.php''' before we open it.  


When you open this file you will see lots of $strings which are used for any customised words or phrases used in this theme. Because this is in the '''foxxie/lang/en/''' directory all the $strings are in English. But if you wanted to add some foreign words and phrases for whenever a user switched languages, you just need to create a new sub-directory in the '''foxxie/lang/''' directory for the language files you need to add there, and then copy and paste this file to that new sub-directory. For example: '''foxxie/lang/it/theme_foxxie.php''' (where '''it''' represent Italian). We will explore the Language aspect of themes in another Moodle Doc. So let's just concentrate on the changes we need to make to the contents of '''theme_foxxie.php'''.
When you open this file you will see lots of $strings which are used for any customised words or phrases used in this theme. Because this is in the '''foxxie/lang/en/''' directory all the $strings are in English. But if you wanted to add some foreign words and phrases for whenever a user switched languages, you just need to create a new sub-directory in the '''foxxie/lang/''' directory for the language files you need to add there, and then copy and paste this file to that new sub-directory. For example: '''foxxie/lang/it/theme_foxxie.php''' (where '''it''' represent Italian). We will explore the Language aspect of themes in another Moodle Doc. So let's just concentrate on the changes we need to make to the contents of '''theme_foxxie.php'''.

Revision as of 06:05, 17 April 2011

Template:Moodle 2.0This document describes how to clone a theme from an existing Moodle 2.0. theme. It assumes you have some understanding of how themes work within Moodle, as well as a basic understanding of HTML and CSS.

Getting started

The first thing to create is a copy of the theme folder, of the theme, you want to clone. For the purpose of this tutorial, we will be cloning Boxxie, which is one of several Moodle core themes.

From your Moodle theme directory right click on boxxie and then copy and paste back into your Moodle theme directory. You should now have a folder called Copy of boxxie. If you right click this folder you are given the option to Rename it. So let's rename this folder to foxxie (or to whatever name you want to call your cloned theme).

If you open the foxxie directory you will find several directories, sub-directories and files within it. One of these sub-directories lang/en/ contain a file theme_boxxie.php which will need to be re-named. But we shall address this later. For now just familiarise yourself with what you find in the foxxie directory.

These are:

config.php
Where all the theme settings are.
/lang/
This directory contains all language sub-directories.
/lang/en/
This sub-directory contains your language files, in this case English.
/lang/en/theme_boxxie.php
This file contains all the language strings for your theme.
/layout/
This directory contains all the layout files for this theme.
/layout/frontpage.php
Layout file for front page.
/layout/general.php
Layout file for general pages.
/layout/embedded.php
Layout file for embedded pages.
/style/
This directory contains all the CSS files for this theme.
/style/core.css
Contains all the CSS rules for this theme.
/style/boilerplate.css
Contains all the reset CSS rules for this theme.
/pix/
This directory contains a screen shot of this theme as well as a favicon and any images used in the theme.
/pix/tabs
This contains all the tab images for this theme.

Re-naming some elements

The problem when cloning a theme is that you need to rename all those instances where the theme name, in this case boxxie, occurs. The first place to look, as mentioned above, is lang/en/theme_boxxie.php. This file, as well as needing to be renamed, also needs some of its content renaming too. So before we forget, let's right click on this file and rename it theme_foxxie.php before we open it.

When you open this file you will see lots of $strings which are used for any customised words or phrases used in this theme. Because this is in the foxxie/lang/en/ directory all the $strings are in English. But if you wanted to add some foreign words and phrases for whenever a user switched languages, you just need to create a new sub-directory in the foxxie/lang/ directory for the language files you need to add there, and then copy and paste this file to that new sub-directory. For example: foxxie/lang/it/theme_foxxie.php (where it represent Italian). We will explore the Language aspect of themes in another Moodle Doc. So let's just concentrate on the changes we need to make to the contents of theme_foxxie.php.

See also