[gelöst] CSS-Dateien optimieren trotz Download-Methode: Privat
Eingetragen von Benjamin S (11)am 17.01.2011 - 11:18 Uhr in
Hallo zusammen,
ich habe das Problem, dass ich im IE an das 30er Limit der CSS-Dateien komme. Außerdem würde ich gern meine Seite etwas beschleunigen. Leider lässt sich die JS und CSS Optimierung ja nicht bei aktiver privaten Download-Methode benützen. Habe schon den Patch 8 und den Workaround (über Theme) probiert, leider beides ohne Erfolg.
Hat jemand eine Idee/Lösung?
Drupal 6.19
- Anmelden oder Registrieren um Kommentare zu schreiben
CSS-Optimierung im Theme
am 25.02.2011 - 16:03 Uhr
Die Zusammenfassung der .css-Dateien wird ins Theme eingebaut. Dazu wird die Datei template.php gepatched und in der Datei page.tpl.php die Ausgabevariable geändert.
Code in template.php: in Zeile 53 wird die Funktion phptemplate_preprocess_page ergänzt.
<?php
//ab hier wird die Orginale Funktion um die CSS-Optimierung ergänzt
$css = drupal_add_css(); //hier werden alle css-Dateien die drupal für die aktuelle Seite laden würde geholt
// Variablen initialisieren
$css_arr = array();
$modifiedDates = '';
$fileString = '';
// alle css-Dateien der Module werden überprüft
foreach($css['all']['module'] as $css_module => $css_module_on) {
if(file_exists($_SERVER["DOCUMENT_ROOT"] . base_path() . $css_module)) { //es wird überprüft ob das css-File an der angegebenen Stelle vorhanden ist...
$modifiedDates .= filemtime($_SERVER["DOCUMENT_ROOT"] . base_path() . $css_module); //hier wirde der Zeitpunkt der letzten Änderung des Files abgefragt und für dem späteren Dateinamen gemerkt
$css_arr[] = $_SERVER["DOCUMENT_ROOT"] . base_path() . $css_module; //hier wird der Pfad und der Name für später gemerkt
$fileString .= $css_module . ','; //hier wird der Name der CSS-Datei für den späteren Dateinamen gemerkt
}
else { drupal_set_message('Die Datei '.$_SERVER["DOCUMENT_ROOT"] . base_path() . $css_module.' kann nicht gefunden werden.', 'error'); } //...wenn nicht, wird in drupal ein Fehler ausgegeben.
}
// alls css-Dateien des Theme werden überprüft. Es ist wichtig, dass dieser Schritt erst nach den CSS der Module passiert, da hier eventuell Einstellungen überschrieben werden sollen
foreach($css['all']['theme'] as $css_theme => $css_theme_on) {
if(file_exists($_SERVER["DOCUMENT_ROOT"] . base_path() . $css_theme)) {
$modifiedDates .= filemtime($_SERVER["DOCUMENT_ROOT"] . base_path() . $css_theme);
$css_arr[] = $_SERVER["DOCUMENT_ROOT"] . base_path() . $css_theme;
$fileString .= $css_theme . ',';
}
else { drupal_set_message('Die Datei '.$_SERVER["DOCUMENT_ROOT"] . base_path() . $css_thme.' kann nicht gefunden werden.', 'error'); }
}
$fileName = 'cache/' . md5($fileString . $modifiedDates) . '.css'; //nun wird für die CSS-Datei dieser Seite ein einzigartiger Dateiname per generiert
$path = file_create_path($fileName); //Pfad und Name wo die Datei gespeichert werden soll
if(!file_exists($path)) { //wenn die Datei nicht bereits existiert wird sie nun generiert
$combinedContent = '';
$unterordner = 0;
foreach($css_arr as $css_file) {
//Variablen initialisieren
$Dateiinhalt = '';
$css_pfad = array();
$i = 0;
//da unterschiedliche Anführungszeichen für den String-Anfang/-Ende gesetzt werden können werden diese hier behandelt
$Dateiinhalt = str_replace("url('", "url(", file_get_contents($css_file));
$Dateiinhalt = str_replace("')", ")", $Dateiinhalt);
$Dateiinhalt = str_replace('url("', 'url(', $Dateiinhalt);
$Dateiinhalt = str_replace('")', ')', $Dateiinhalt);
//da sich die CSS-Dateien in Unterordner des Moduls befinden können, würden die Pfade zu z.B. Bildern nicht mehr korrekt sein, deshalb müssen diese hier geändert werden
$css_pfad[0] = substr($css_file, 0, strrpos($css_file, '/'));
$css_pfad[0] = str_replace('/var/www/drupal', '', $css_pfad[0]);
$Dateiinhalt = str_replace('url(', 'url(http://'.$_SERVER["SERVER_ADDR"].$css_pfad[0].'/', $Dateiinhalt);
while (eregi($_SERVER["SERVER_ADDR"].$css_pfad[$i].'/../', $Dateiinhalt)) { //weiterer Unterordner?
$css_pfad[$i+1] = substr($css_pfad[$i], 0, strrpos($css_pfad[$i], '/'));
$Dateiinhalt = str_replace('url(http://'.$_SERVER["SERVER_ADDR"].$css_pfad[$i].'/../', 'url(http://'.$_SERVER["SERVER_ADDR"].$css_pfad[$i+1].'/', $Dateiinhalt);
$i++;
}
$combinedContent .= PHP_EOL.PHP_EOL.$Dateiinhalt; //hier wird der Inhalt der Datei zwischengespeichert.
unset($css_pfad);
}
if(!$fh = fopen($path, 'w')) { drupal_set_message('Die Datei '.$file.' kann nicht geöffnet werden.', 'error'); exit;}
if(!fwrite($fh, $combinedContent)) { drupal_set_message('In die Datei '.$file.' kann nicht geschrieben werden.', 'error'); exit;}
fclose($fh);
}
$vars['styles_aggregated'] = '<style type="text/css" media="all">@import "/' . $path . '";</style>'; //diese wird dann in der page.tpl.php in Zeile 12 ausgegeben
unset($css_arr);
?>
Änderung in page.tpl.php: in Zeile 9.
<?phpprint $styles
?>
wird in
<?phpprint $styles_aggregated
?>
geändert.
So funktioniert die Lösung jetzt auch bei mir.