How to use theme (CSS) created by us in moodle

How to use theme (CSS) created by us in moodle

by Mamta k. -
Number of replies: 1

We have tried to implement our own theme using following steps in our website.

"Each theme is in a subdirectory of the "theme" directory, and contains at least the following files:

  • config.php : defines the theme colours used throughout the site
  • styles.php : the style sheet, containing CSS definitions for standard HTML elements as well as many Moodle elements.
  • header.html : Included at the top of each page. This is what you need to edit to add a logo at the top of pages, for example.
  • footer.html : Included at the bottom of each page.

To create your own themes for current versions of Moodle:

  1. Copy one of the existing theme folders to one with a new name. I recommend starting with one of the standard themes.
  2. Edit config.php and insert your own colours.
  3. Edit styles.php and change your CSS styles.
  4. Edit header.html and footer.html to add new logos, or change the layout.

Note that all these steps are optional - you can make a radically different look to your site simply by editing the colours in config.php "

My concern / Issues as given below:

1. If we do not have header.html, footer.html then how can we workout for this files in theme folder?

2. Can I override Moodle default theme by using my .css files directly for my .html / .php pages?

     If "Yes" then HOW?

Note: Actually we have designed our own .HTML pages for the whole website which will handle basically two modules; Quiz & Lessons. In this scenario which would be the best way to maintain the Look and Feel of the pages across the website without much changes in the themes's .css file.

Any help would be appreciated!

Thanks in Advance,

Mamta

Average of ratings: -
In reply to Mamta k.

Re: How to use theme (CSS) created by us in moodle

by Patrick Malley -
Since I am unable to discern what it is you've already attempted and don't know what you're actually trying to do, let me tell you how I go about a new theme.

I start with the "Standard" theme (../moodle/theme/standard). I copy it, then change the name of that new "Standard" file to reflect my new theme (ex: "newtheme"). That new theme that I created will contain everything needed within it (header.html, footer.html, all css files, etc.). I change those files, then I upload it to my theme directory.

I wouldn't try to do anything too fancy - Moodle CSS is vast and necessary. If you start hacking, you may not stop!
Average of ratings: -