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.

Themes

From MoodleDocs
Revision as of 21:13, 12 July 2005 by Urs Hunkler (talk | contribs)
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Moodle Themes

HowTo - Upgrade Your Theme from Moodle 1.4 to 1.5


Get Firefox and it's "Web Devloper" extension

Use the "Information" menu in it to look how the elements and areas of the Moodle pages are called. Use the "CSS/Edit CSS" menu in it to try new CSS properties and see directly the changes in the page.

!!Upgrade to Moodle 1.5

Make the normal upgrade to Moodle 1.5. Your theme will be kept, but it will not work in Moodle 1.5. You have to create a new one.

  • make a copy of standardwhite
  • rename it to your new theme name
  • create a new CSS file
  • edit config.php and add your new stylesheet name in addition to the CSS file "gradients" or replace it

!!Change the Header and Footer Files

Please do not copy your header and footer into the new theme directory, because the themes need the new files. Especially the divs are needed. Better you add your logo and pictures to the new header file. If necessary change the footer too.

!!Build Your CSS to Rework Your Moodle 1.4 Theme

Looking at the site in Firefox with the "Web Developer" extension, start adding new styles to your new CSS file. Some you can copy from the 1.4 theme, some you can't. To get an impression how the styling works look at the other themes coming with your Moodle installation. Ask on the Moodle forums especially the "Themes" forum when you need help.

Many elements in Moodle pages have multiple short names in the class tag like the sideblocks "block_activity_modules sideblock". You can apply styles to all sideblocks using the class name "sideblock" or only to the block "Activity" using the class name "block_activity_modules".

!!Further Informations about Moodle 1.5 Themes

Links to Theme Pages