Wenn Sie Ihr ILIAS-System anpassen wollen, um z.B. Ihr eigenes Firmenlogo oder eine eigene Farbgestaltung zu verwenden, dann sollten Sie unter keinen Umständen die ILIAS Originaldateien verändern, da sonst nicht gewährleistet werden kann, dass Ihre Änderungen nach einem Update oder ILIAS-Bugfix noch vorhanden sind.

ILIAS bietet für diese Fälle die Möglichkeit, eigene Skins und Styles zu definieren. Hier erfahren Sie schrittweise, wie das funktioniert.

Bevor wir ins Detail gehen, sei angemerkt, dass diese Anleitung nur mit ILIAS Versionen größer oder gleich ILIAS 3.8 funktioniert.

Anlegen eines eigenen "Skin"

Damit Sie einen eigenen Skin in ILIAS verwenden können, müssen Sie diesen erst einmal anlegen. Ich gehe im folgenden davon aus, dass wir unseren eigenen Skin "Firma" nennen wollen. Dazu legen Sie nun in Ihrem ILIAS-Hauptverzeichnis die folgenden Verzeichnisse an:

Customizing/global/skin/Firma

In diesem Verzeichnis müssen wir nun eine Datei mit dem Namen template.xml erstellen, welche ILIAS die Informationen über unseren Skin und die verwendeten Styles (CSS-Dateien mit den Farbdefinitionen) übermittelt. In dieser Datei dürfen sich Informationen über mehrere Styles befinden, im vorliegenden Fall möchten wir aber nur einen Style verwenden. Der Dateiinhalt sieht nun folgendermaßen aus:

Wenn Sie möchten, können Sie diese Datei direkt vom aurealis-Server herunterladen.

Damit der Skin nun noch funktionstüchtig wird, müssen wir den Style, also die zu verwendende CSS-Datei mit den Stilinformationen noch in unserem Skin-Verzeichnis erstellen. Damit der Style erst einmal auf dem ILIAS-Standard-Style "delos" aufbaut, kopieren wir die Datei

templates/default/delos.css

und erstellen daraus unsere eigene Style-Datei für unseren "Firma"-Skin. Der Name unseres Styles, der in ILIAS mit "Firma" angezeigt wird, entspricht dem "id"-Attribut der "style"-Auszeichnung in der template.xml-Datei, erweitert um die Dateiendung ".css", also "firma.css". Wir erstellen also die Kopie der ILIAS-Datei delos.css in unserer eigenen Style-Datei

Customizing/global/skin/Firma/firma.css

Da die delos.css-Datei, die wir nun umkopiert haben, einige Grafiken verwendet, ist es sinnvoll, das ILIAS-Verzeichnis

templates/default/images 

komplett in unser Skin-Verzeichnis zu kopieren.

Aktivieren des Skin

Nun kommt bereits der Teil, in dem wir unseren neuen Skin mit dem dazugehörigen Style testen können. Dafür wechseln Sie in ILIAS in Ihren persönlichen Schreibtisch und von dort in den Karteireiter "Persönliches Profil" und ändern unter "Einstellungen" > "Skin / Style" Ihren persönlichen Skin / Style auf "Firma / Firma". Diese Kombination sollte nun in der Drop-Down-Liste erscheinen und auswählbar sein. Nach dem Speichern werden Sie hoffentlich feststellen, dass sich NICHTS geändert hat. Lediglich unter der Haube können Sie feststellen, dass mittlerweile Ihr eigener "Firma" Skin verwendet wird. Wenn Sie sich den Quelltext ihrer aktuellen ILIAS-Seite anschauen, so sollten Sie nun relativ am Anfang des Quelltextes den Verweis auf den "Firma" Style finden:

... link rel="stylesheet" type="text/css" href="./Customizing/global/skin/Firma/firma.css ...

Individualisieren von ILIAS-Templates

Zum Ändern von Farben oder anderen Stil-Eigenschaften müssen Sie nun lediglich die Style-Datei firma.css bearbeiten und die gewünschten Einträge verändern bzw. neue Einträge hinzufügen. Welche CSS-Stile innerhalb von ILIAS verwendet werden, finden Sie am einfachsten heraus, indem Sie sich den HTML-Quellcode der ILIAS-Seiten anschauen, an denen Sie Änderungen vornehmen möchten.
Um ILIAS-eigene Templates zu verändern, müssen Sie nun nicht mehr die Templates direkt verändern, sondern Sie können bestehende Templates aus dem Verzeichnis templates/default einfach in Ihr Skin-Vereichnis kopieren und dort verändern.

Als Beispiel werden Sie das ILIAS-Logo durch Ihr eigenes Firmenlogo ersetzen. Dazu kopieren das Firmenlogo in das images-Verzeichnis des Firma Skin. Im Beispiel handelt es sich um eine 150 Bildpunkte breite und 44 Bildpunkte hohe Grafik mit dem Namen firma.png:

Nun müssen Sie noch das ILIAS-Template für die Kopfzeile mit der Navigation und dem Logo finden und dieses Template in das Verzeichnis des Firma Skin kopieren. Das Template finden Sie in

templates/default/tpl.main_buttons.html

Kopieren Sie diese Datei nun unter dem gleichen Namen in Ihr Firma Skin Verzeichnis. Der HTML-Code für die Anzeige des ILIAS-Logos sieht in ILIAS 3.9 folgendermaßen aus:

Ersetzen Sie den Code für das Logo nun durch Ihren eigenen Code:

Speichern Sie die Änderungen in Customizing/global/skin/Firma/tpl.main_buttons.html. Damit sich das Logo farblich einigermaßen in das ILIAS Template einpasst, ermitteln Sie aus dem HTML-Quellcode den CSS-Stil für die Kopfzeile mit dem Logo. Ein Blick in die Template-Datei offenbart schnell, dass es sich um den CSS-Stil "ilMainHeader" handelt.

Nun ändern Sie in der Style Datei firma.css noch den Eintrag div.ilMainHeader von

 

in

 

Das Endergebnis ist dann eine geänderte ILIAS-Darstellung mit eigenem Firmenlogo:

Wichtige ILIAS-Templates

Einige wichtige ILIAS-Templates, die Sie in der Regel abändern werden, wenn Sie Ihren eigenen Style erzeugen sind:

• templates/default/tpl.main_buttons.html
  ILIAS Kopfzeile mit den Menüeinträgen und dem Logo
• templates/default/tpl.login.html
  ILIAS Anmeldeseite
• templates/default/tpl.locator.html
  ILIAS Positionszeile, welche die hierarchische Position im Magazin anzeigt
• templates/default/tpl.adm_content.html
  Haupttemplate für den Bildschirmaufbau. Fast alle Ausgabetemplates integrieren ihre Inhalte in dieses Template

Überschreiben von Templates und Stilen aus ILIAS-Modulen

Nicht nur die Haupttemplates von ILIAS lassen sich in das eigene Skin-Verzeichnis kopieren und verändern, auch Templates aus ILIAS-Modulen, wie z.B. dem Test & Assessment lassen sich in einem Skin verändern. Die ILIAS-Module befinden sich im Modules-Verzeichnis des ILIAS-Hauptverzeichnisses.

Sie müssen in Ihrem Skin lediglich die Modulstruktur anlegen und können dann die Template-Dateien in diese Struktur kopieren. Für das Template zur Anzeige der Teilnehmer eines Tests kopieren Sie die Datei

Modules/Test/templates/default/tpl.il_as_tst_participants.html

an die folgende Position:

Customizing/global/skin/Firma/Modules/Test/tpl.il_as_tst_participants.html

d.h. Sie erstellen die Verzeichnisse Modules/Test innerhalb Ihres Skin-Verzeichnisses und kopieren dann die zu verändernde Template-Datei in das Verzeichnis hinein. Dort können Sie die Datei dann wie gewohnt bearbeiten und verändern.

Fazit

Mit dem Customizing-Prinzip von ILIAS können Sie mit wenig Aufwand eigene, auf Ihre Bedürfnisse individualisierte Anpassungen des ILIAS-Systems vornehmen. Die Anpassungen können dann für einzelne Benutzer des Systems oder über die Administration auch für alle Benutzer des Systems zur Verfügung gestellt werden. Der Vorteil dieser Vorgehensweise ist eine Unabhängigkeit von Aktualisierungen am ILIAS-System, die z.B. mit Bugfixes eingespielt werden können. Natürlich müssen Sie darauf achten, dass bei Veränderungen durch Bugfixes, diese Veränderungen auch in Ihre angepassten Templates einfließen. Ein großer Vorteil ist, dass Sie Ihre Anpassungen durch einfaches Kopieren der betreffenden Verzeichnisinhalte auf andere iLIAS-Installationen übertragen können.