Version vom 24. September 2011, 12:18 Uhr

Theme+ verbessert Contao im Umgang mit Stylesheets und JavaScript Dateien.

Theme+

Theme+ ist der Nachfolger für Contao 2.10 von layout_additional_sources - kurz LAS - für Contao 2.9. Theme+ ist ein nahezu vollständiger Rewrite und im Stil des API driven development aufgebaut.

Features

• Einbinden externer Stylesheet und JavaScript Dateien aus tl_files/ oder als URL.
• Zusammenführen von Stylesheet und JavaScript Dateien, einschließlich der Contao CSS Dateien und Plugin CSS/JS Dateien.
• Minimieren von Stylesheet und JavaScript Dateien mittels yui-compressor (benötigt den yui-compressor und Java installiert auf dem Server) oder cssmin/jsmin (cssMinimizer und jsMinimizer)
• Support für lesscss mittels less.js (benötigt Node.js installiert auf dem Server) oder phpless.

Geplante Features

• Eigener CSS Parser, soll Fehleranalyse verbessern und phpless ersetzen.
• Unterstützung für weitere JavaScript Frameworks.

Update von LAS möglich?

Ein Update von LAS ist möglich. Dazu muss zuerst die Contao Installation auf 2.10 aktualisiert werden (LAS vorher nicht deinstallieren!). Nachdem Contao auf 2.10 aktualisiert wurde, über den Erweiterungskatalog Theme+ [theme_plus] installieren (auch ohne vorher LAS zu deinstallieren). Theme+ aktualisiert automatisch alle Einstellungen von LAS und löscht LAS danach automatisch.

Aktivieren von Vereinigung und Minimierung

Compression API Einstellungen

Die Vereinigung von Stylesheet und JavaScript ist automatisch aktiviert, wenn Theme+ installiert wurde. Für die Minimierung muss zusätzlich ein Minimizer installiert werden.

• yui-compressor, vermutlich bester Minimizer für CSS und JS
  Diese Erweiterung ist lediglich ein Wrapper für ein auf dem System installierten yui-compressor.
• cssMinimizer, PHP Minimizer für CSS, basierend auf cssmin
• jsMinimizer, PHP Minimizer für JS, basierend auf jsmin
• DeanEdwardsPacker, PHP Minimizer für JS, basierend auf dem dean.edwards.name/packer/
  Der DEP verwendet eine spezielle Verpackungsweise, man könnte auch sagen, eine Komprimierung in JavaScript. Bei großen JavaScript Dateien kann dadurch die Dateigröße reduziert werden, im Gegenzug hat der Browser mehr zu berechnen um das JavaScript zu "entpacken".

Um den Minimizer zu aktivieren, muss dieser in den Systemeinstellungen im Bereich Compression API ausgewählt werden. Theme+ und die gesamten Minimizer basieren auf der Compression API, deshalb nutzt Theme+ dessen Einstellungen.

Deaktivieren von Vereinigung und Minimierung

Code wenn im BE angemeldet

Code wenn im BE abgemeldet

Die Vereinigung lässt sich nicht global deaktivieren, sie wird aber temporär deaktiviert, wenn ein Benutzer sich am Backend anmeldet. Auf diese einfache Art soll die Arbeit für Entwickler vereinfacht werden. Beim Umsetzen eines Layouts brauch der Entwickler sich nur am Backend anmelden, dann werden die einzelnen Dateien mit ein paar Debug Informationen im Code eingefügt.

Um die Minimierung zu deaktivieren, muss in den Systemeinstellungen der Minimizer geändert werden.