WordPress-Plugins zur Bildanpassung: Regenerate Thumbnails und Photon

Manchmal gibt es Situationen, da wünscht man sich ein kleines Helferlein herbei, das ruckzuck die bestehenden Probleme löst. Eine dieser Situationen dürfte jedem WordPress-Nutzer bekannt sein: Man wechselt auf ein neues Theme und die Größe der Vorschaubilder passt auf einmal nicht mehr. Wenn Sie zu groß sind, verliert das Theme seine Wirkung, sind sie zu klein, werden sie eventuell per CSS auf die benötigte Größe hochgerechnet, was sie pixelig und unansehnlich macht. Manche Themes zeigen zu kleine Vorschaubilder in der (zu kleinen) Größe direkt an, was ebenfalls die Wirkung des schönen neuen Themes zerstört. Regenerate Thumbnails löst dieses Problem, indem es alle bereits bestehenden Post-Thumbnails auf die neue Größe zuschneidet. Photon bietet eine weniger destruktiv arbeitende Alternative, ist aber Teil des Mammut-Plugins Jetpack. Wir haben uns beide angesehen…

Das Problem: nicht passende Beitragsbilder

Damit ein WordPress-Theme so gut zur Wirkung kommt, wie es vom Entwickler gedacht und in der Live-Demo (meistens) verwirklicht wurde, benötigt es eine spezielle Größe von Beitragsbildern – zumindest, wenn welche verwendet werden sollen. Ad-hoc fallen mir gleich zwei Szenarien ein, in denen nicht passende Vorschaubilder für eine wesentlich schlechtere Gesamtwirkung auf den Betrachter des Themes sorgen.

Beispiel Nummer 1: Das Enfold-Theme

Enfold ist eines der meistverkauften Themes weltweit und man kann eine ganze Menge damit machen. Unter anderem kann es in der Blogansicht die Sidebar ausblenden und die Artikel mit großen, ansprechend wirkenden Beitragsbildern präsentieren. Sind die Beitragsbilder allerdings zu klein für die Großansicht der Beitragsbilder, so werden diese vom CSS des Themes einfach auf die passende Größe hochgerechnet. Je nach Ausgangsgröße sieht das einfach nicht gut aus.

Das eigentliche Beitragsbild liegt in 750 x 319 Pixel vor. Das Enfold-CSS rechnet es auf die benötigte Größe von 1180 x 502 Pixel hoch. Dadurch sieht es milchig und pixelig aus. Die gesamte, vom Entwickler angedachte Wirkung geht sozusagen baden.

Beispiel Nummer 2: Das Wilson Theme

Das hier angesprochene Beispiel sieht man recht häufig, obwohl es einfach zu beheben ist. Die Größe der Beitragsbilder variiert je nach Höhe des Bildes, einmal bekommt man ein Bild in einer passend aussehenden Größe präsentiert, ein weiterer Post jedoch hat eine andere Bildhöhe. Unterschiedliche Bildhöhen jedoch können die Wirkung des Themes beeinträchtigen.

Der Effekt entsteht dadurch, dass nur die Inhaltsbreite für die Beitragsbilder im CSS notiert und die Höhe der Bilder auf 100% gesetzt wurde. Man kann es so verwenden, aber schön ist das nicht. Mit korrekt definierten, gleichgroßen Beitragsbildern würde das Theme besser auf den Betrachter wirken. Es würde „runder“ aussehen.

Der Lösung erster Teil: Artikelbildgröße anpassen

In der Dokumentation fast jedes Themes ist auch die optimale Größe für Beitragsbilder zu finden. Sollte dem nicht so sein, lässt sich zum Beispiel mit Google Chrome die korrekte Größe leicht herausfinden. Eines der Beitragsbilder wird rechts angeklickt, dann geht man im Kontextmenü auf „Element untersuchen“. In dem sich nun öffnenden Fenster ist, wenn man mit der Maus auf den <img> Tag im unteren Fenster (ist markiert) geht, die Größe abzulesen.

In diesem Fall wäre – da das obere von beiden Artikelbildern größenmäßig korrekt wirkt – die benötigte Größe 629 x 267 Pixel. Diesen Wert kann man durchaus auch aufrunden auf 630 x 270 Pixel.

Korrekte Artikelbildgröße einstellen

Diese Größe wird nun im WordPress-Dashboard eingestellt, die Einstellungen sind unter „Einstellungen => Medien“ zu finden.

Alle zukünftig hochgeladenen Beitragsbilder werden nun auf die korrekte Größe zugeschnitten und in den Beitrag integriert.

Alle bisherigen Beitragsbilder anpassen

Jetzt bleibt nur noch das Problem mit allen anderen sich bereits in der Mediathek befindenden Beitragsbilder bestehen. Hat man gerade angefangen zu bloggen, ist es vielleicht kein Problem, alle als Beitragsbild verwendeten Bilder nochmals hochzuladen, damit sie auf die korrekte Größe zugeschnitten werden. Wer allerdings bereits einige hundert oder gar tausende Beitragsbilder in der Mediathek hat, sieht sich mit einem echten Problem konfrontiert. Denn es sollen ja alle Artikel mit korrekten Bildern versehen werden.

Der Lösung zweiter Teil: Das Regenerate Thumbnails Plugin

Dieses kleine Plugin erlaubt es, alle sich in der Mediathek befindenden Beitragsbilder im Bulk auf die neue, dann korrekte Größe zuzuschneiden.

• Entwickler: Alex Mills (Viper007Bond)
• Wird ständig weiter entwickelt: nach Bedarf
• Letzte Version vom: 01.04.2014
• Kompatibel mit WordPress 4.1.1: Vollständig
• Kosten: kostenfrei über WordPress.org
• Lizenz: GNU GENERAL PUBLIC LICENSE
• Wechselwirkungen mit anderen Plugins: nicht bekannt
• Entwickler-Homepage:  Regenerate Thumbnails Homepage
• Download von WordPress.org

Nach der Installation ist das Tool unter „Werkzeuge => Reg.Thumbnails“ zu finden. Einstellungen gibt es keine, nachdem man in den Einstellungen der Mediathek die korrekte Größe definiert hat, muss man in den Plugin-Einstellungen nur noch auf den Button „Regenerate All Thumbnails“ klicken. Alles weitere passiert dann automatisch.

Nun kommt es darauf an, wieviel Beitragsbilder bereits in der Mediathek vorhanden sind, bei nur wenigen Bildern geht der Prozess sehr schnell. Bei einer gut gefüllten Mediathek kann der Umwandlungsprozess durchaus einige Minuten in Anspruch nehmen.

In der Mediathek meiner Testseite befanden sich nur 39 Bilder, der Umwandlungsprozess hat keine 30 Sekunden gedauert und hat keinerlei Fehler verursacht, wie dem Screenshot zu entnehmen ist.

Manuelle Größenänderung der Beitragsbilder

Eine weitere Funktion bietet das Plugin noch, man kann auch unter „Medien => Medienübersicht“ die Beitragsbildgröße manuell ändern. Dazu fährt man einfach mit der Maus über das jeweilige Bild, die Option „Regenerate Thumbnails“ erscheint dann.

Das Endergebnis: eine stimmige Website

Alle Beitragsbilder wurden nun durch die korrekte Thumbnail-Größe ausgetauscht und haben nun alle eine einheitliche Größe erhalten. Und das ganz ohne den Einsatz von potenziell gefährlichen Scripten wie TimThumb.php.

Ein Klick auf das Bild öffnet den kompletten Screenshot

Regenerate Thumbnails ist eines der praktischeren WordPress-Plugins. Probleme mit nicht passenden Thumbnail-Größen gehören der Vergangenheit an, denn nun kann man für jedes eingesetzte Theme die richtige Größe der Beitragsbilder generieren. So wirkt jedes Theme gleich viel „professioneller“.

Zu erwähnen ist, dass Regenerate Thumbnails im Grunde nichts anderes als ein Stapelaufsatz für ein paar WordPress-Kernfunktionen ist. Wenn Sie die Einstellung aus „der Lösung erster Teil“ vorgenommen haben, wird ja durch WordPress beim neuen Hochladen eines Bildes stets ein Thumbnail in der hinterlegten Größe erstellt. Regenerate Thumbnails tut nichts anders, als diese Funktion Bild für Bild für den Altbestand erneut aufzurufen; etwas, das man mit WordPress allein nicht tun kann. Das liegt aber nicht daran, dass es technisch nicht ginge, sondern lediglich daran, dass ein derartiger Zugang zum Feature nicht vorgesehen ist.

Alternative: Photon aus Jetpack

Mit Photon, Teil des Riesen-Plugins Jetpack aus dem Hause Automattic, kann man sich Regenerate Thumbnails komplett sparen. Mit Jetpack haben wir uns in diesem Beitrag bereits beschäftigt. Photon leistet zweierlei. Zum einen ist es eine Art CDN für Bilder, speichert also alle Bilder Ihrer Site zwischen und liefert sie eigenständig aus. Dazu schreibt es die Bilddaten zur Laufzeit um, so dass keine Änderungen in der WordPress-Datenbank erforderlich sind. Das ist praktisch und wichtig, wenn man sich dereinst entscheidet, Photon nicht mehr zu verwenden.

Zum anderen, einhergehend mit dieser Funktionalität, sorgt Photon dafür, dass stets die richtigen Bildgrößen geliefert werden, ohne dass es einer „harten“ Lösung wie Regenerate Thumbnails bedürfte. Photon arbeitet dynamisch, quasi unabhängig vom konkreten Theme, während Regenerate Thumbnails sämtliche Bilder tatsächlich in die zuvor gewählte Auflösung ändert. Bei Photon wird an den Bildern keine Änderung vorgenommen.

Photon skaliert Bilder allerdings nicht hoch. Wenn Sie also von einem Theme mit schmalerer Bildfläche und entsprechend angepasstem Material auf eines wechseln, das den Bildern mehr Breite einräumt, wird Photon da nichts nützen. Denn das Hochskalieren wäre mit einem – je nach Unterschied – mehr oder weniger großen Qualitätsverlust verbunden, den der Service nicht liefern will. Photon geht also so vor, dass die Bilder stets so skaliert werden, dass sie entweder der Größe des eigentlichen Bildes oder der Breite des umgebenden Elements angepasst sind, je nachdem, was von beiden kleiner ist. Dementsprechend muss man für eine möglichst großformatige Darstellung entsprechend großformatige Bilder hochladen, was man natürlich schwerlich als Nachteil wird bezeichnen wollen.

Neben diesem „Vorteil“ im Vergleich zu Regenerate Thumbnails ist noch zu erwähnen, dass sich Photon um alle Bilder, nicht nur um Featured Images und Thumbnails kümmert. Zu verschweigen ist allerdings auch nicht der Nachteil, den Jetpack gerade in der Anwendung in Deutschland mitbringt und den wir ausführlich im weiter oben verlinkten Beitrag diskutiert haben.

 Links zum Beitrag

• TimThumb WebShot Code Execution Exploit (0-day)
• WordPress Plugin Regerate Thumbnails – Download von WordPress.org
• Regenerate Thumbnails Homepage
• Photon

Mehr von Dr. Web zum Thema:

• Folge dem Trend: 23 kostenlose WordPress-Themes aus dem Februar 2015
• Top 100: die besten kostenlosen WordPress-Themes des Jahres 2014
• Dezember 2014: 23 vielseitige, kostenlose WordPress-Themes und das neue Jahr kann kommen
• So finden Sie das perfekte kostenlose WordPress-Theme
• November 2014: 22 kostenlose WordPress-Themes für fast jeden Bedarf
• Feucht durchwischen: 22 kostenlose WordPress-Themes bringen Ihren Blog zum Strahlen (Oktober-Edition 2014)
• Danke: Anders Norén entwickelt bildschöne, kostenlose WordPress-Themes

(Autoren: Andreas Hecht und Dieter Petereit, Redaktion Dr. Web)

(dpe)