Auf dieser Seite sehen Sie die schreibgeschützte und geprüfte Version eines Artikels aus dem Einsatzleiterwiki-Projekt. Wenn Sie einen Artikel bearbeiten bzw. am Projekt aktiv mitarbeiten möchten, so besuchen Sie bitte das bearbeitbare Wiki. Für weitere Informationen zum Projekt allgemein rufen Sie bitte diese Seite auf.
Designanpassungen (eigene CSS-Regeln)
Falls Sie sich bisher noch nie mit HTML- und CSS-Programmierung beschäftigt haben, ist https://wiki.selfhtml.org/wiki/CSS sowie http://www.css4you.de/ eine gute Anlaufstelle. Auch wenn es nicht sonderlich kompliziert ist, ein grundlegendes Verständnis über das Programmieren sollte vorhanden sein.
Der größte Teil des Aussehens der dem Einsatzleiterwiki zugrunde liegende DokuWiki-Software kann durch Cascading Style Sheets angepasst werden. Die DokuWiki-Software selbst definiert nur einige wenige Designregeln. Der größte Teil wird im genutzten Template sowie in den verwendeten Plugins festgelegt.
Die dort festgelegten Regeln können durch eigene CSS-Regeln überschrieben werden. Dies kann in vier verschiedenen Dateien geschehen. Diese Dateien müssen im Unterordner conf, ausgehend vom Wiki-Hauptverzeichnis, angelegt werden.
| CSS-Datei | Wann sie verwendet wird |
|---|---|
conf/userall.css | In jedem Modus |
conf/userstyle.css | Im Bildschirm-Modus |
conf/userprint.css | Wenn die Seite gedruckt wird |
conf/userfeed.css | Wenn der (RSS-)Feed dargestellt wird |
Die hier genannten Dateien werden bei einer Aktualisierung nicht angetastet und bleiben unverändert bestehen.
Sofern es keinen Grund gibt den eigenen CSS-Code in eine der anderen css-Dateien zu schreiben, sollte dieser immer die die conf/userall.css-Datei eingefügt werden, da dieser CSS-Code Anweisungen aus allen anderen Dateien überschreibt.
Eine einfache Bearbeitung dieser Dateien ist mit dem advanced-Plugin: erweiterte Konfigurationsdateien komfortabler und direkt im Wiki-Adminbereich bearbeiten möglich.
Links zu Grafiken und weiteren Stylesheets
Relative Links zu Grafiken (url(…)) und verlinkte Stylesheets (@import …) in eigenen CSS-Dateien werden durch DokuWiki automatisch angepasst; sie werden als relativ zum Hauptverzeichnis des Templates angesehen.
Beispiel
- userall.css
/* Hintergrundfarbe für Tabellenüberschriften (orange) */ .dokuwiki table.inline th { background-color: #ffcc00; }
Quellenangabe
- https://www.dokuwiki.org/start?id=devel:css, übersetzt aus dem Englischen. Der Originalartikel geht jedoch noch wesentlich weiter ins Detail
Diskussion