css files in von contao erzeugte Datei einbeziehen (& minimieren)

[Flaschenzug]

Hallo,

wie ist es denn möglich, eine CSS Datei in die Kompilierung durch das Contao Core einzubeziehen (ohne diese als CSS zu importieren).
Speziell gefragt geht es um die Bootstrap CSS Files (und auch JS Files). Diese hätte ich gerne mit in der einen Datei integriert.

Gibt es dafür eine einfache Lösung?

Danke und - falls nicht mehr im alten Jahr - einen guten Rutsch allerseits und bis 2015.
Viele Grüße und gute Nacht.

[kos]

Schau dir mal die Erweiterung theme_plus an.

[MacKP]

Das kannst du auch schon mit den Contao selbst erreichen, indem du die Resourcen im Seitenlayout einbindest (Externe CSS Dateien). Die JS Dateien müsstest du allerdings in templates ablegen (z.B. mit moo_ am Anfang) um die dann auch auswählen zu können (meine zumindest, das es so gehen müsste.. bin mir da nicht 100% sicher, weil ich das noch nicht gebraucht habe).

Viele Grüße

[kos]

Das kannst du auch schon mit den Contao selbst erreichen, indem du die Resourcen im Seitenlayout einbindest (Externe CSS Dateien)

Findet dann auch eine Komprimierung statt??
Ich habe das einmal versucht und da war das nicht der Fall, aber vielleicht habe ich ja auch etwas übersehen.

[MacKP]

Das wird inzwischen komplett zusammen geführt und dann komprimiert.

Viele Grüße

[Spooky]

Das wird inzwischen komplett zusammen geführt und dann komprimiert.

Hm, kann ich nicht bestätigen. In einer Contao 3.4.0 Testinstallation werden im Seitenlayout eingebundene, externe Stylesheets nicht minimiert. Zusammengeführt werden sie schon seit 3.0 denke ich - minimiert aber nach wie vor nicht.

Ein Umstand den ich schon lange beanstandet habe - denn es macht aus meiner Sicht keinen Sinn, dass Contao den minifier nur auf die internen Stylesheets ausführt und nicht einfach auf das fertig generierte Stylesheet (inklusive den externen Stylesheets).

[MacKP]

Uhm stimmt. Wundert mich jetzt aber. Ich glaub ich hab das nur nicht gemerkt (das nicht komprimieren), da ich das automatisiert vorher mache. Ich dachte eigentlich auch, das Contao das macht ><
@Spooky : Danke für die Richtigstellung. Wenn du dazu ein Ticket angelegt hast, würde ich mich da gerne melden um das zu unterstützen ;-)

Wobei die Komprimierung externer Resourcen per Checkbox erfolgen sollte (also an- / abschaltbar), damit man eventuelle Fehler dadurch vermeiden kann, indem man das selber vorher macht etc.

Viele Grüße

[kos]

...Wenn du dazu ein Ticket angelegt hast, würde ich mich da gerne melden um das zu unterstützen ;-)

Da würde ich mich auch anschließen. Irgendwie mag ich den internen CSS-Editor nicht besonders.

[Spooky]

Uhm stimmt. Wundert mich jetzt aber. Ich glaub ich hab das nur nicht gemerkt (das nicht komprimieren), da ich das automatisiert vorher mache. Ich dachte eigentlich auch, das Contao das macht ><
@Spooky : Danke für die Richtigstellung. Wenn du dazu ein Ticket angelegt hast, würde ich mich da gerne melden um das zu unterstützen ;-)

Wobei die Komprimierung externer Resourcen per Checkbox erfolgen sollte (also an- / abschaltbar), damit man eventuelle Fehler dadurch vermeiden kann, indem man das selber vorher macht etc.

Viele Grüße

Ich dachte ich hätte mal ein Ticket angelegt, aber anscheinend doch nicht. Hab es mir nochmal im Core angesehen: Contao verwendet eigentlich gar keinen CSS minifier. Die internen Stylesheets sind deshalb minified, weil sie einfach bei einer Änderung in der Datenbank dynamisch neu erzeugt werden (und daher auch gleich minified sind - StyleSheets::writeStyleSheet(...)). Für ein solches feature müsste Contao nun auch einen eigenen CSS minifier mitbringen, ich denke das wird wohl eher nicht passieren - derartige Aufgaben müssen oder sollten wohl mit Extensions (wie Theme+) gemacht werden.

[kos]

... derartige Aufgaben müssen oder sollten wohl mit Extensions (wie Theme+) gemacht werden.

Gibt es denn zu dem doch sehr umfangreichen theme_plus Alternativen, die das auch können?

Ich frage, weil eine theme_plus Installation über Composer bei 1&1 wegen zu wenig Memory gescheitert ist, ich aber eigentlich nur externe CSS-Einbindung und Komprimierung nutzen wollte

[Spooky]

Eine Alternative kenne ich nicht. Aber wegen dem Memory Problem: mach' dir eine lokale Kopie der website (exkl. files/ und der Datenbank), führe die Installation per Composer durch und lade danach die neuen Inhalte aus system/modules und composer/ wieder auf den Webspace. So würde ich zumindest derartige Probleme umgehen, wenn es nicht anders geht.

[kos]

Danke für den Tipp, werde ich demnächst mal testen.

[Spooky]

Heb' dir aber unbedingt ein komplettes Backup der Seite vorher auf

[dackelchen]

Ich klinke mich hier mal eben ein.

Wie machst Du das vorher mit der Komprimierung MacP? Hast Du da ein Programm, das bestenfalls auch mit meinen Javascriptgrundkenntnissen funktioniert?

[Samuell]

Er nutzt vorher Sass/Compass, soweit ich weis und komprimiert damit das CSS bei Bedarf.
Funktioniert ziemlich gut und zuverlässig!

[dackelchen]

Mir gehts eigentlich nur um JS.

[Flaschenzug]

Na das sind ja mal viele Antworten in kurzer Zeit :-).

Also ich habe heute noch mal im Backend geschaut und folgendes geändert:
Vorher hatte ich den externen CSS Style (bzw. den im assets Ordner) über den HEAD Bereich eingebunden "Zusätzliche <head>-Tags".
Und gerade habe ich es weiter oben unter "Externe Stylesheets" eingebunden.

Da die Datei bereits komprimiert ist, weiß ich nicht ob es mit komprimiert werden würde oder nicht.
Aber das ist so schonmal wie gewünscht bzgl. dem CSS.

Die Frage ist jetzt nur, ob das ganze nicht auch mit JS so machbar ist.

[Spooky]

Die Frage ist jetzt nur, ob das ganze nicht auch mit JS so machbar ist.

Nur indirekt. Als Workaround könntest du dir bspw. ein Template anlegen das mit j_ oder moo_ beginnt, je nachdem ob du jQuery oder MooTools auf der Seite verwendest (oder egal wenn beides der Fall ist) und in diesem Template steht dann einfach nur:

<?php
$GLOBALS['TL_JAVASCRIPT'][] = $GLOBALS['TL_CONFIG']['uploadPath'].'/foo/js/myscript1.js|static';
$GLOBALS['TL_JAVASCRIPT'][] = $GLOBALS['TL_CONFIG']['uploadPath'].'/foo/js/myscript2.js|static';
// ...
?>

Und dieses Template aktivierst du dann im Seitenlayout unter den JavaScript Templates. Siehe auch http://rocksolidthemes.com/de/contao...eit-optimieren - Schritt 4: JavaScript zusammenfassen

Auch hier müsstest du das minifying der JavaScripts selbst übernehmen.

[dackelchen]

Auch hier müsstest du das minifying der JavaScripts selbst übernehmen.

Spooky, wie mache ich das denn nun ganz genau? Gibts da so eine Art "DAU-Programm?

Ich bin da noch ein Lernender.

...und da Du hier konkret die Anleitung von Rocksolid ansprichst...

Da kopiere ich ja die Core-Js-Dateien in ein Template. Was mache ich denn geschickterweise, wenn ich das Template schon habe, in meinem Fall habe ich das j:accordion zusätzlich angepasst (geht ja inzwischen) Dann hätte ich zwei Datein mit demselben Namen.

Sorry, wenn ich mich da gerade ziemlich laienhaft ausdrücke, aber, wie gesagt, ich lerne das gerade.

[kos]

.. Was mache ich denn geschickterweise, wenn ich das Template schon habe, in meinem Fall habe ich das j:accordion zusätzlich angepasst (geht ja inzwischen) Dann hätte ich zwei Datein mit demselben Namen.

Hallo Edgar,

du kannst doch einen Phantasienamen vergeben, wichtig ist, er beginn mi "j_" (für jQuery) bzw mit "moo_" (MooTools).
Das wird dir dann im Seitenlayout unter den jeweiligen JS-Dateien angezeigt.

[Flaschenzug]

perfekt Spooky. Genau das war es.
Dabei habe ich dann auch noch gesehen, dass ich im selben Rutsch gleich auch noch CSS mit integrieren kann.
Jetzt wird das komplette Bootstrap JS und CSS in die eine Datei integriert und ich bin glücklich :-).

Danke für die vielen schnellen Antworten und auch für die Diskussion die damit verbunden war.