LESS individuell in Warp7
Autor: Christian Hamberger, Kategorie: Warp 7, uikit, Widgetkit, Erstellt am: 16.10.2015, Bearbeitet: 22.11.2015, Aufrufe: 2858
Das Schöne an Warp7 ist, dass man LESS individualisieren kann. Statt eine Custom CSS baut man sich eine Custom LESS Datei, die CSS Befehle beherrscht und darüber hinaus natürlich LESS. Diese Anleitung ist für Joomla Systeme gedacht.
Wie legt man eine eigene LESS Datei an?
- Duplizieren den Ordner
/less
und nenne ihn/less-custom
. - Nun muss der Pfad in der
config.php
(Template Ordner) angepasst werden.'less' => array(__DIR__.'/less'),
>>> wird zu
'less' => array(__DIR__.'/less-custom'),
- Der komplette Dateiinhalt in der
/less-custom/theme.less
wird nun gelöscht und durch die folgende Zeile ersetzt:@import "../less/theme.less";
- Der komplette Dateiinhalt in der
/less-custom/bootstrap.less
wird nun gelöscht und durch die folgende Zeile ersetzt:@import "../less/bootstrap.less";
- Aufgrund des Importes (Schritt 3) sind im Verzeichnis
/less-custom
UIkit und Bootstrap nicht mehr nötig. Daher werden die Verzeichnisse gelöscht:/less-custom/uikit
/less-custom/bootstrap
- Nun kann man mit seinem individuellen LESS-Code in der Datei
/less-custom/theme.less
verwenden.
Troubleshooting
- Änderungen haben keine Auswirkung
LESS muss kompiliert werden damit die Änderungen im Frontend Auswirkungen haben. Dies macht man wie folgt:Erweiterungen > Template > Stile > Dein Template >>> Compile LESS
Tipp: Hier kann man auch einstellen, dass bei jedem Seitenaufruf LESS automatisch kompiliert wird. In der Entwicklungsphase ist die Option sehr hilfreich.
Quellen: