Wordpress und das PNG-Thumbnail-Problem
Vor kurzem erst stellte ich fest, dass Wordpress Probleme mit der Thumbnail-Generierung hat. Nicht bei JPGs, aber bei PNGs, deren Thumbnail im Beispiel größer als das Original ausfiel. Doch was tun? Die Lösung bzw. ein denkbarer Workaround wäre es nun, die Thumbnails immer in JPG auszugeben. Das heißt, dass auch wenn ich als Artikelbild ein PNG hochlade, Wordpress das Thumbnail auch als JPG speichert und verwendet. Die werden von Wordpress nämlich effizienter erstellt und somit tritt das Problem hier auch nicht auf. Bei stark optimierten, eventuell sogar indizierten PNGs ist es der Fall, dass das Thumbnail mit kleineren Maßen am Ende mehr Speicher als das Originalbild benötigt. Aber dazu hatte ich ja schon den Vergleich im vorherigen Artikel aufgestellt. Würde Wordpress also alle Thumbnails als JPG speichern, wäre das Ergebnis wieder korrekt bzw. würden Bilder nicht unnötig größer als sie eigentlich sind. Doch wie geht das? Wie immer mit einem Snippet.
Folgendes in die Functions.php eures Theme einfügen:
add_filter('wp_generate_attachment_metadata','force_png_to_jpg'); function force_png_to_jpg($image_data) { $sizes = array('thumbnail','medium','large'); $upload_dir = wp_upload_dir(); $file = $upload_dir['path'] . '/' . basename($image_data['file']); foreach($sizes as $size){ if(isset($image_data['sizes'][$size])) { if( $image_data['sizes'][$size]['mime-type'] == "image/png" ){ $dest_file = preg_replace('/\.png$/i', '.jpg', $image_data['sizes'][$size]['file']); $image_data['sizes'][$size]['file'] = $dest_file; $image_data['sizes'][$size]['mime-type'] = "image/jpg"; $image = imagecreatefrompng($file); $bg = imagecreatetruecolor(imagesx($image), imagesy($image)); imagefill($bg, 0, 0, imagecolorallocate($bg, 255, 255, 255)); imagealphablending($bg, TRUE); imagecopy($bg, $image, 0, 0, 0, 0, imagesx($image), imagesy($image)); $bg = imagescale($bg, $image_data['sizes'][$size]['width'], $image_data['sizes'][$size]['height'] ); imagedestroy($image);
$quality = 75; imagejpeg($bg, $upload_dir['path'] . '/' . $dest_file, $quality); imagedestroy($bg); } } }
return $image_data; }
Thumbnails von PNG als JPG speichern
Das Snippet oben wandelt nun die PNGs in JPGs um, sodass ein Thumbnail, auch wenn das Artikelbild ein PNG ist und bleibt, immer als JPG gespeichert wird. Doch Vorsicht: So eine Umwandlung frisst auch Ressourcen und weil das massenhafte Umwandeln schnell ganze Server lahmlegt (es hat einen Grund warum Bildoptimierer meist auf externen Servern laufen und Gebührenpflichtig sind), kann es sein, dass das Snippet bei euch nicht korrekt funktioniert, weil derartiges auf eurem Hosting deaktiviert wurde bzw. unterbunden wird oder verboten ist. Die Qualität des erzeugten JPGs könnt ihr im Snippet frei anpassen.
Hier steht es auf 75%, was zu leichten Qualitätsverlusten führt, die Dateigröße aber noch einmal deutlich verkleinert. Denkt immer daran: Es sind nur Thumbnails und kein Mensch wird sich ernsthaft daran stören wenn selbige nicht ganz scharf oder qualitativ hochwertig sind, schließlich wartet im Artikel meist auch noch das große Bild. Thumbnails sollen nur zum Klick animieren, da braucht es keine HD Qualität, denn die frisst Speicherplatz und Ladezeit. Ob ihr so eine PNG-Konvertierung benötigt, ist aber nicht pauschal zu sagen. Mein Test im Artikel zu dem Problem hat aber gezeigt, dass es zumindest bei optimierten PNGs Probleme mit der Bildgröße geben kann.
