PrestaShop: eigenes CSS im Theme ergänzen

Für PrestaShops gibt es eine große Auswahl guter responsive Themes. Auch wenn diese sehr ausgereift sind, können kleinere Änderungen am CSS notwendig sein, um am Ende ein stimmiges und zum Corporate Design passendes Layout zu erhalten.

Zwar könnten die Theme-CSS-Files direkt modifiziert werden, was jedoch die spätere Updatefähigkeit gefährden würde. Das Anlegen eines eigenen Themes wäre ebenfalls denkbar, macht jedoch wegen weniger Zeilen CSS wenig Sinn.

Ziel wäre es daher, eine eigene CSS-Datei zu verwenden und in das Theme zu integrieren. Diese ist sehr einfach machbar, in dem die entsprechende Datei - können natürlich auch mehrere sein - in den Ordner

/themes/name-des-themes/css/autoload

eingefügt wird. Diese wird dann automatisch geladen.

Mit dieser Lösung lassen sich in einem PrestaShop kleine Style-Änderung schnell und unkompliziert umsetzten.

Reihenfolge geladener CSS-Dateien in einem PrestaShop

Die Reihenfolge der im Frontend geladenen CSS-Dateien ist fest definiert und gestaltet sich wie folgt:

1. die Dateien aus dem CSS-Grundverzeichnis (themes/name-des-themes/css/)
2. CSS-Files aus dem autoload-Ordner (themes/name-des-themes/css/autoload) in alphabetischer Reihenfolge
3. CSS-Dateien der verwendeten Module

Ggf. werden zwischen 2. und 3. noch die Styles für jQuery-Module geladen. Davon abgesehen wird das CSS-Verzeichnis logisch abgearbeitet.