Das mächtige Content-Management System Moodle ist von haus aus nicht unbedingt das schönste. Um es aber vor allem an das Design der jeweiligen Bildungseinrichtung anzupassen sind noch einige Handgriffe mehr von nöten. Wir stellen kurz die wichtigsten Schritte auf dem Weg zum eigenen Moodle Theme vor.
Fertiges Moodle Theme finden und installieren
Auf der im Moodle Repository gibt es nicht nur zahlreiche Extensions sondern auch Themes für Moodle. Dort kann man aus zahlreichen fertigen Layouts das schönste wählen und für sein eigenes Moodle herunterladen.
- Theme herunterladen
- Theme lokal entpacken
- Theme auf Server laden - in Verzeichnis - /moodle/theme/[Designname]
- CHMOD auf 755 wird empfohlen, da es sonst zu Anzeigeproblemen kommen kann.
- Login in Moodle - Website-Administration -> Darstellung -> Designs ->Design-Auswahl - hier kann das neue Design aktiviert werden.
Eigenes Moodle Theme erstellen
Wenn alles nicht passt, kann man immernoch selbst ein eigenes Theme entwickeln. Epfohlen wird dabei oft das standard-theme zu kopieren und dieses zu überarbeiten.
- Zuerst wird die config.php angelegt. Alles weitere ist optional. /theme/yourtheme/config.php
- In dieser Datei müssen die folgenden Zeilen vorhanden sein:
$THEME->sheets = array('user_styles');
$THEME->standardsheets = array('styles_layout');
$THEME->parent = 'custom_corners'; // put the name of the theme folder you want to use as parent here.
$THEME->parentsheets = array('user_styles');
Hier wird festgelegt welches Modul oder Theme überarbeitet werden soll. Will man von null anfangen nutzt man:$THEME->parents = array('base','canvas');
Dieses vorgehen nett sich "Template Override" und macht das Layout stabiler und unanfällig gegen Updates. Wenn also ein neues Moodle herraus kommt, funktioniert die Webseite und das Theme auch obwohl Code überschrieben wurde. - Farbänderungen werden über die user_styles.css durchgeführt. Hier emfiehlt sich das kostenfreie Firefox Plugin Firebug um die richtigen Klassen zum bearbeiten zu finden. Das bearbeiten von Templates und CSS Dateien wurde schon erklärt.