WordPress Mediathek, Bildgrößen und Thumbnails verstehen

Wie funktioniert eigentlich die WordPress Mediathek, was bedeuten die eingestellten Bildbrößen in der Mediathek, wie und wo werden zum Beispiel die hochgeladenen Bilder eigentlich abgelegt? Wie binde ich unter WordPress 2.9 die sogenannten Miniaturbilder bzw. Artikelbilder (post thumbnails) in mein verwendetes WordPress Theme ein? Die Klärung all dieser Fragen haben ich einmal versucht in diesem Artikel zusammen zu fassen.

Allgemeines zur Mediathek unter WordPress

Die Mediathek gibt es seit WordPress 2.5, sie ermöglicht die Verwaltung von Bildern, Galerien, Audiodateien, Videos und anderen hochgeladenen Dateien. WordPress erkennt beim Hochladen den Dateityp automatisch und sammelt alle Mediendateien eines Blogs in der zentralen Bibliothek. Die Mediathek enthält alle hochgeladenen Medien die in einer einfachen Medienübersicht direkt verwaltet werden können.

Die Mediathek wurde bis zur heutigen WordPress 2.9 Version einige male erweitert und die Sicherheit kommt auch nicht mehr zu kurz.

Neue Dateien direkt zur Mediathek hochladen

Einzelne Dateien, die sogenannten Medien, können ganz einfach vom eigenen PC direkt zur Mediathek hinzugefügt werden. Dies erfolgt unter Mediathek >> Datei hinzufügen. Im Anschluss nach dem Hochladen hat man die Möglichkeit, den Titel, eine einfache Beschreibung, eine Beschriftung und eine detailliertere Beschreibung einzugeben. In dieser Maske sieht man auch wo die Datei auf dem Webserver abgelegt wird (Datei-URL).

Neue Datei(en) direkt über die WordPress Mediathek hochladen

Neue Dateien beim “Artikel bearbeiten” zur Mediathek hinzufügen

Medien-Dateien können aber auch direkt bei der Bearbeitung eines Artikels hochgeladen werden. Dies ist sicherlich der am häufigsten genutzte Weg. Dort hat man standardmäßig die Möglichkeit Bilder, Videos, Audio oder andere Dateien zum Artikel hinzuzufügen.

Welche Dateitypen wirklich ins Medienarchiv hochgeladen werden dürfen, hängt  von einer eigens vorgegebenen MIME-Type-Whitelist ab. Diese Whitelist beschränkt die möglichen Dateitypen für den Upload. In dem oben genannten Artikel zur „Sicherheit“ kann man nachlesen wie man die erlaubten Mediatypen (Mime-Types) erweitern oder ganz abschalten kann. Ab WordPress 2.8.5 gilt diese Whitelist übrigens auch für Administratoren.

Medien-Dateien die man direkt bei einem Artikel hochgeladen hat, werden zu einer Gallery am Artikel hinzugefügt. Mann kann diese Bilder dann später als Gallerie in den gleichen oder in andere Artikel einbauen.

Hier sieht man eine Gallerie Übersicht. Diese Bilder sind direkt dem Artikel zugeordnet.

Soweit eine kleine Übersicht über einige Möglichkeiten der Mediathek. Am häufigsten werden sicherlich Bilder zur Mediathek hinzugefügt. Besonders hat mich dabei interessiert, wo werden diese Bilder abgelegt und was passiert eigentlich beim hochladen der Bilder im Hintergrund.

Was passiert eigentlich beim Hochladen der Bilder in die Mediathek.

Die einzelnen Bilder werden im eingestellten Upload-Verzeichnis auf dem Webserver abgelegt. Die Einstellung für das “Dateien Hochladen” erfolgt als Administrator unter Einstellungen >> Verschiedenes.

Administration: Einstellungen – Verschiedenes – Dateien hochladen

Benutzt man eine WordPress Basis Installation für verschiedene Webseiten (Multi-Subdomains installieren) so muss man den hier angegebenen Upload-Order entsprechend anpassen., damit die Uploads aus verschiedenen Domains nicht alle in einem Ordner landen. Für einen zweiten Weblog habe ich dort zum Beispiel als Basisverzeichnis “wp-cotent/uploads/_blogzwei” angegeben. Alle Uploads erfolgen ab dann in dem Verzeichnis und sollten am besten in “Monats- und jahresbasierten Ordnern” organisiert werden. Dadurch kann man die Dateien später besser und schneller wieder finden.

Bilder werden beim Hochladen in die Mediathek standardmäßig (wenn möglich) immer in drei voreingestellten Bildgrößen abgelegt. Darüber hinaus wird natürlich noch das original Bild abgespeichert. Ob wirklich alle drei voreingestellten Bildgrößen abgelegt werden hängt allerdings noch von der eigentlichen Größe des Bildes ab, denn ist das hochgeladene Bild entsprechend kleiner als die eingestellten Werte, werden die nächst größeren Bildgrößen nicht extra erzeugt. Dies war mir bisher nicht so bewusst, ist aber für die effektive Nutzung der Mediathek sehr entscheidend.

Die Einstellung für die Bildgrößen erfolgt im Administrationsbereich unter Einstellungen >> Mediathek. Dort kann man die Größe der Miniaturbilder und die Mittlere und Maximale Bildgröße einstellen.

Administration: Einstellungen – Mediathek – Bildgrößen unter WordPress

Neben den drei standardmäßig eingestellten Bildgrößen hat man als erfahrener WordPress Weblog Nutzer sogar noch die Möglichkeit automatisch weitere Bildgrößen beim Hochladen erzeugen zu lassen. Dazu muss man in die functions.php Datei des verwendeten Themes folgenden Code einfügen.

add_image_size('small-list-thumbnails', 50, 50, false);

Nun wird beim Hochladen eines Bildes zusätzlich eine Datei in der Größe 50 x 50 Pixel abgelegt. Über den angegebenen Namen kann man später direkt auf dieses Bild-Format zugreifen. Gerade ab WordPress 2.9 hat man viele neue Möglichkeiten um auf die sogenannten “post thumbnails” zuzugreifen. Mehr zu dem Thema findest du weiter unten in diesem Beitrag.

Vorteil vordefinierter Bildgrößen

Der Vorteil vordefinierter Bildgrößen liegt übrigens auf der Hand. Die Bilder brauchen dann bei der Ausgabe nicht notwendigerweise skaliert werden. So könnte es zum Beispiel dazu kommen, das man, so wie heute gerne gemacht, Miniaturbilder auf der Startseite neben den einzelnen Artikeln platzieren möchte. Hat man nun bisher die Größe der Miniaturbilder mit 75 x 75 Pixel angegeben, möchte nun aber Miniaturbilder mit 125 x 125 Pixel anzeigen, so wird zum Beispiel unter WordPress 2.9 das nächst größere Bildformat herangezogen, das evtl. 250 x 250 Pixel groß ist und dann bei der Ausgabe auf die Größe von 125 x 125 skaliert, bevor es auf der Webseite angezeigt wird. Man hat so schnell unnötig größere Webseiten erzeugt und die Ladezeiten der Bilder erhöhen sich ebenfalls.

Man sollte sich also rechtzeitig über die einzelnen Bildgrößen Gedanken machen. Gerade am Anfang eines neuen Weblogs sollte man sich Gedanken darüber machen, welche Bildgrößen man später Standardmäßig in seinem Blog und in den Artikel einfügen möchte, denn dadurch hat man es später einfacher.

Denn werden später im Laufe der Zeit die Einstellungen für die Bildgrößen geändert, so hat dies nämlich keine Auswirkungen auf bereits hochgeladene Bilder. Nur neue Bilder werden in den neuen Formaten abgelegt. Will man nachträglich zum Beispiel die Größe der Miniaturbilder verändern, so ist dies nur mit Hilfe entsprechender WP-Plugins möglich – dazu nun mehr.

Nachträgliches Anpassen der WordPress Mediathek Bildgrößen

Ich persönlich wollte die neuen Möglichkeiten der Artikelbilder unter WordPress 2.9 nun auch nutzen, habe aber feststellen müssen, das meine vordefinierten Einstellungen für die Bildgrößen nicht optimal waren. Um nun die Größe der Miniaturbilder von 75 x 75 Pixel auf eine Größe von 125 x 125 Pixel zu vergrößern habe ich mich auf die Suche nach einem nützlichen, zuverlässigem WordPress Plugins begeben. Von Hause aus ist dies mit WordPress leider nicht möglich.

Gefunden habe ich zwei zuverlässige Plugins, die da sind: das Regenerate Thumbnails von Viper007Bond und AJAX Thumbnail Rebuild vom Junk Coder. Ich habe beide Plugins vor dem Einsatz im Live-System” getestet und war mit beiden Ergebnissen zu frieden.

Beide Plugins  lassen das bestehende Bild mit den Ausmassen 75 x 75 Pixel an Ort und stelle liegen und erzeugen lediglich ein neues Bild (vom Original) mit den neuen Miniaturbildmaßen von 125 x 125 Pixel. Die Umstellung der Thumbnails bzw. Artikelbilder auf meinem Live-System habe ich letztendlich mit Regenerate Thumbnails durchgeführt. Auf den folgenden drei Gallery Bildern kannst du den Fortschritt der Änderungen sehen.

Artikelbilder / Post Thumbnails

Seit der WordPress Version 2.9 gibt es die sogenannten Artikelbilder (”post thumbnails”). Durch diese Funktion kann man nun zum Beispiel auf der Startseite oder in Übersichtsseiten wie dem Artikelarchiv zur Veranschaulichung ein Bild zu jedem Artikel hinzufügen. Bisher war dies unter WordPress nur mit einer Pluginlösung oder den benutzerdefinierten Feldern möglich.

Damit diese Funktion im aktuell verwendeten WordPress Theme funktioniert, muss man sie aktivieren. Zur Aktivierung muss man in die functions.php Datei des verwendeten Themes folgenden Code einfügen:

//Theme functions
if ( function_exists('add_theme_support') ) {
  add_theme_support('post-thumbnails');
}

Wenn du selber dein WP-Theme anpassen möchtest um Thumbnails anzeigen zu lassen, dann kann ich dir noch den Beitrag The ultimative Guide for the_post_thumbnail in WordPress 2.9 von Micha empfehlen. Dort zeigt er eine Übersicht zu den einzelnen Methoden wie man die Tumbnails in das eigene WordPress Theme integriert. Mehr zu dem Thema Thumbnails kannst du auch bei Frank in seinem Beitrag WordPress Post Thumbnail und die Abwärtskompatibilität nachlesen.

Mein Fazit

In meinem Blog verwende ich nun die neue WordPress Funktionalität mit den Artikelbildern. Das war auch der Grund mich mit den oben genannten Funktionen der Mediathek zu beschäftigen. Ich hoffe, ich konnte mit diesem Artikel zum Theme Mediathek, etwas Licht in den „dunklen Tunnel“  bringen. Ich habe versucht einige Themen zur Mediathek zusammen zu fassen. Vielleicht wird es nun zu einzelnen Funktionen noch etwas genauere Artikel geben, denn ich finde man nutzt die wirklichen Möglichkeiten der WordPress Medithek gerade am Anfang nicht wirklich aus …