Sidebar
ein-/ausblenden

WordPress Post Thumbnail und die Abwärtskompatibilität

Plugin für WordPress SEO

Anzeige

WP Adventskalender 18
WordPress bringt mit Version 2.9 die wohl am meisten diskutierte Funktion des Post Thumbnails in das System. Für windige Theme-Autoren war das auch im Vorfeld kein Thema und trotzdem wird sie geliebt. Wichtig bei dieser Funktion, sie geht nur, wenn man sie explizit im Theme aktiviert. Dies macht der folgenden kleine Schnipsel in der functions.php des Themes: add_theme_support('post-thumbnails');.

Aber auch bei dieser Funktion sollte man auf das Vorhandensein der Funktion prüfen und eine Alternative anbieten. Nur so kann man dem Nutzer die Freiheit der WordPress Version überlassen. Die Funktionen von Erweiterungen, Plugins und Themes gehröen einer Prüfung unterzogen; so ist die Funktion des Themes abgesichert, auch wenn eine Funktion nicht zur Verfügung steht. Ähnlich sehe ich es mit dieser Funktion für die Thumbnails zum Beitrag, auch wenn sie Funktionen aus dem Core nutzen.

Zwei Anregungen für Alternativen möchte ich im folgenden kurz aufzeigen und ich verweise auf den ausführlichen Artikel zum Thema Bilder in Themes mit Benutzerdef. Feldern oder der Mediathek von WordPress nutzen.

Nach Hinzufügen der folgenden Syntax in der functions.php des Themes steht die MetaBox im Bereich Schreiben eines Beitrags bzw. Seite bereit und kann einfach via Aufruf der Mediathek aus dieser MetaBox genutzt werden.


if ( function_exists('add_theme_support') )
	add_theme_support('post-thumbnails');

Alternativ kann man zwischen Beiträgen und Seiten trennen:


add_theme_support( 'post-thumbnails', array( 'post' ) ); //Beiträge
add_theme_support( 'post-thumbnails', array( 'page' ) ); //Seiten

Man kann im übrigen auch Größen definieren, zum einen direkt für Thumbnails ...


set_post_thumbnail_size( 150, 150, true ); // Breite, Höhe, true für kein crop mode; beschneiden

... und ebenso andere Größen, in dem man zusätzlich einen Namen vergibt. Im obigen Code ist der Standard-Name post-thumbnail übergeben.


add_image_size('my-single-picture', 150, 150, false);

Die Ausgabe des Bildes wird dann im Theme an der Stelle, wo es erscheinen soll, einfach mit Hilfe des Template Tag erzeugt: the_post_thumbnail().


if ( current_theme_supports( 'post-thumbnails' ) )
	the_post_thumbnail( array(300,200) );

Alternativ kann man dann auch wieder die eigenen Typen abfragen:


the_post_thumbnail( 'my-single-picture' );

Wichtig, arbeitet man mit zusätzlichem Markup, dann gehört die Abfrage dazu, ob es denn ein Thumbnail zum Beitrag gibt. Ansonsten wird unnötig Markup ausgegeben, welches keinen Inhalt hat.


<?php
if ( has_post_thumbnail() ) { ?>
	<span class="my_image">
		<?php the_post_thumbnail(array(600, 400)); ?>
	</span>
} ?>

Um nun aber eine Alternative für Installationen kleiner WP 2.9 zu haben, kann man verschiedene Ansätze gehen. Die zwei folgenden Beispiele sind daher als Ideengeber zu verstehen: entweder mit Hilfe der benutzerdefinierten Felder, Feldname ist post-image ...


if ( function_exists('has_post_thumbnail') && has_post_thumbnail() ) {
	the_post_thumbnail(); // @parameter: array(height, width)
} else {
	$myimage = get_post_meta($post->ID, 'post-image', true); // via custom field
	if ($myimage) {
		echo '<img class="wp-post-image" src="'.$postimage.'" alt="Post Iage" />';
	}
}

... oder im nachfolgenden Beispiel das erste Bild aus der Mediathek. Mehr dazu gibt es in einem separaten Beitrag.


if ( function_exists('has_post_thumbnail') && has_post_thumbnail() ) {
	the_post_thumbnail(); // @paramter: array(height, width)
} else {
	// via mediathek
	$attachments = get_children( array(
									'post_parent'    => get_the_ID(),
									'post_type'      => 'attachment',
									'numberposts'    => 1, // show all -1
									'post_status'    => 'inherit',
									'post_mime_type' => 'image',
									'order'          => 'ASC',
									'orderby'        => 'menu_order ASC'
									) );
	foreach ( $attachments as $attachment_id => $attachment ) {
		echo wp_get_attachment_image( $attachment_id );
	}
}

Prüfen ob das Theme die Funktion unterstützt ist ebenso möglich:


if ( current_theme_supports( 'post-thumbnails' ) ) {
	...

Zusätzlich kann man prüfen, ob das Theme die Funktion unterstützt und explizit für Beiträge (post) oder Seiten (page) nutzen. Sehr interessant, wenn man zusätzliche Funktionen in den Schreiben-Bereich des Backend bringen möchte, welcher abhängig von diesem Feature innerhalb des Theme ist.:


if ( current_theme_supports( 'post-thumbnails', array( 'page' ) ) ) {
	add_meta_box( ...

In diesem Zusammenhang kann man auch extern Dateien mit neuen Funktionen einbinden.


require_if_theme_supports( 'post-thumbnails', ABSPATH . WPINC . '/my-post-thumbnail-funktion.php' );
Artikel #1079, 18. Dezember 2009 · Themes, Tipps, WordPress · 21 Kommentare · Kommentar schreiben
Tags: , , , , , , ,
read: 6149 · today: 73 · last: 17. März 2010
Kommentar-Feed zum Artikel · TrackBack URL

«
»

21 Kommentare zu „WordPress Post Thumbnail und die Abwärtskompatibilität“

  1. 1
    Kommentar von Sergej Müller
    18. Dezember 2009 um 09:36

    Das hast du jetzt aber aus meinem Related Posts by Category Plugin oder? Nein, Scherz beiseite. Die Abwärtskompatibilität für die Post Thumbs habe ich dort nach dem gleichen Muster realisiert.

  2. 2
    Kommentar von Frank Bültge
    18. Dezember 2009 um 10:53

    @Sergej: hast du Thumbs in dem Plugin? Dachte immer, du gibst nur die Artikel aus und fertig. Nun ist sogar ein Plugin im SVN, wusste ich gar nicht.

  3. 3
    Kommentar von Sergej Müller
    18. Dezember 2009 um 10:57

    Oh ja, wurde von den Nutzern gewünscht, hatte ich mal versprochen dieses Jahr noch fertig zu stellen. Ich glaube, vor 2 oder 3 Wochen hatte ich die Umsetzung dann fertig, aber durch die verzögerte Tests ist das Plugin erst vor wenigen Tagen in der aktualisierten Fassung (also mit Thumbs) online gegangen.

  4. 4
    Kommentar von Frank Bültge
    18. Dezember 2009 um 11:20

    @Sergej: das kenne ich; habe hier eine große Liste an Wünschen liegen, es werden sicher nicht alle zu Weihnachten erfüllt werden.

  5. 5
    Kommentar von Sergej Müller
    18. Dezember 2009 um 11:23

    Ich dachte, ich mach noch noch einen Wunsch klar, bevor ich in den Urlaub gehe.

  6. 6
    Kommentar von Nicki
    18. Dezember 2009 um 12:11

    He Jungs, ich will auch mal was sagen! Kann ich, oder macht ihr Kaffeeklatsch?
    Liest sich alles super - bisher nutze ich noch nicht einmal die Thumnails aus der Mediathek, sondern lade diese selber hoch (Zuordnung einfach nach post_ID) , warum?

    1. Deine Abfrage kostet pro post zwei Queries - das wären bei mir satte 80! Hilfe ;)
    2. Die Qualität der Thumbs lies bis jetzt sehr zu wünschen übrig, vor allem die "Crops" ... leider.

    Würde mich sehr freuen, wenn jemand von Euch beiden weiterhelfen könnte.

  7. 7
    Kommentar von Frank Bültge
    18. Dezember 2009 um 13:16

    @Nicki: Die Qualität kannst du nur schwer ändern, man kann eigene Scripte einbauen um das Verkleinern (TimThump) zu optimieren, da sollte es was geben, auch als Plugin, z.b. Attachment. Zu den Queries; da gibt es mehr zu sagen. Grundlegend spielt hier der Aufbau des Templates eine Rolle, also so wenig Loops wie nötig, am besten einen und dort alles abbilden.

  8. 8
    Kommentar von Nicki
    18. Dezember 2009 um 16:37

    Täusche ich mich - auch wenn ich nur einen Loop habe und die Abfrage nach dem hier genannten Prinzip mache, dann kommen doch trotzdem 2 Queries mal X posts raus?!

  9. 9
    Kommentar von Melvenue
    19. Dezember 2009 um 00:11

    Danke für die Tipps. :)

  10. 10
    Kommentar von Frank Bültge
    20. Dezember 2009 um 21:35

    @Nicki: nein, ich denke du hast recht - habe aber bisher nur gespielt, keine endgültigen Tests gemacht.

  11. 11
    Kommentar von Nicki
    20. Dezember 2009 um 23:38

    Und ich habe es jetzt probiert und es ist tatsächlich so - macht für jede Abfrage 2 Queries. Das letztendlich keine Problem, ein immer gut zu wissen :D .

  12. 12
    Kommentar von Sergej Müller
    21. Dezember 2009 um 07:08

    Nicki, das ist leider so. Die Abfragen sind nicht wirklich effizient gebaut, liegt aber wahrscheinlich daran, dass die Funktionen aus jeder Ecke der API angesprochen werden sollen.

  13. 13
    Kommentar von Dirk
    24. Dezember 2009 um 20:48

    Da mein Theme nicht veröffentlicht wird, könnte ich darauf verzichten, die Funktion abwärtskompatibel zu machen :)

  14. 14
    Kommentar von Stefan B.
    2. Januar 2010 um 20:00

    Danke für die ausführliche Beschreibung. Mir war bisher die Funktion

    add_image_size('my-single-picture', 150, 150, false);

    mit einer eigenen Definition einer Thumbnailgröße nicht bekannt. Dies werde ich nachher gleich mal ausprobieren.

    Eine Frage zu der eingestellten Miniaturbild-Größe in den Einstellungen der Mediathek habe ich noch. Ich hatte diese bisher auf 75 x 75 eingestellt und nun auf 120 x 120 geändert. Die angezeigten Images auf meinen beiträgen haben sich aber nicht geändert (chache vorher aktualisiert). Eingebunden habe ich die thumbnails mit:

    the_post_thumbnail('thumbnail', array('class' => 'alignleft sb_post_thumbnail'));

    Hat da jemand eine Idee warum sich da nichts ändert. Oder gilt die neue Größe nur für neu hochgeladene Bilder?

  15. 15
    Kommentar von Frank Bültge
    3. Januar 2010 um 14:08

    @Stefan: nein, die ändern sich nur bei neu hoch geladenen Bildern, aber es gibt ein Plugin dafür um alle bestehenden Bilder neu zu laden.

  16. 16
    Kommentar von Stefan B.
    3. Januar 2010 um 17:40

    Kannst du mir evtl sagen wie das teil heisst? Ich würde das gerne einmal ausprobieren. Danke.

  17. 17
    Kommentar von Frank Bültge
    3. Januar 2010 um 19:39

    @Stefan: Ich musste erstmal suchen, habe es aber: Regenerate Thumbnail

  18. 18
    Kommentar von Stefan B.
    4. Januar 2010 um 19:39

    Hallo Frank. Danke für den Tipp. Ich habe das Plugin gleich mal auf einer Testseite ausprobiert. Zusätzlich habe ich noch ein Plugin gefunden, das "AJAX Thumbnail Rebuild", es ist noch sehr neu. Beide Plugins funktionieren gut. Bevor ich mich an meinen "Live Blog" mache werde ich aber noch ein paar Tests machen und schauen wie sich das ganze verhält.

    Ein Grund warum ich die Einstellungen ändern möchte ist der, das wenn man Thumbnail Bilder auf eine Größe wie z.B. 100x100 als Parameter angibt und die Standardgröße in den WP Mediathek Einstellungen aber auf 75x75 angegeben hatte, wird immer das nächst größere Bildformat herangezogen (in WP: Medium) und dieses dann nur skaliert auf die angegebene Größe von 100x100. So werden unnötig große Bilder geladen und als Thumbnail ausgegeben. Deshalb möchte ich die Bilder auf eine einheitliche Thumbnailgröße skallieren. Da hast du mir mit deinem Tipp sehr weiter geholfen.

    Vielleicht schreibe ich nach den gemachten Anpassungen einen kleinen Beitrag über meine Erfahrungen.

  19. 19
    Kommentar von Frank Bültge
    4. Januar 2010 um 20:56

    @Stefan: Der Artikel wäre toll! Gern auch als Gastbeitrag hier wenn du magst. Ja, WP zieht immer das nächst größer und verkleinert via CSS, was in vielerlei Hinsicht Ressourcen kostet.

  20. 20
    Kommentar von Schnitz
    16. Januar 2010 um 13:36

    Weiß jemand ob man irgendwie direkt an den Bildlink kommen kann?
    Ich würde das Bild gerne direkt verlinken um es in ner Slideshow zu verwenden :-/

  21. 21
    Kommentar von Schnitz
    16. Januar 2010 um 16:59

    Habs schon selbst gefunden. Geht ja super über den alten weg -> Attachment Metadaten nutzen: http://bueltge.de/wordpress-attachment-metadaten-nutzen/625/

Überlastung, Kommentare sind vorübergehend geschlossen

Ich bin urlaubsreif, ersticke in Arbeit und damit auch für die Leser des Weblogs nicht zu erreichen. Bitte geduldet euch ein wenig mit Supportanfragen.
Leider muss ich die Kommentarfunktion deaktivieren, ansonsten würde ich weiter in Arbeit ersticken oder die Anfragen nicht nach bestem Gewissen beantworten.

Vielen Dank für das Verständnis!