Artikelbilder in unterschiedlichen Größen erzeugen und je nach Bedarf dann verwenden

Zu diesem Artikel inspirierte mich eine Frage im Forum.. Ich formulier die Frage mal um:

Wie kann ich auf der Startseite die Artikelbilder oder Beitragsbilder in Größe X verwenden und im Artikel in Größe Y und bei den Suchergebnissen in Größe Z.

Zuerst brauchst du dazu die functions.php des verwendeten Themes

Zuerst lege ich eine post thumbnail Größe fest. Die erste Zahl gibt immer die Breite an, die zweite die Höhe. Steht da 9999 dann wird die Höhe nach der Breite berechnet. Gebe ich als zweite Zahl eine fixe Zahl an, wird das Thumb beschnitten.
Je nachdem welchen Effekt ich wo haben mag.

Im zweiten Teil schaffe ich mir eigene thumb Größen. Da kann ich hunderte machen, soviele wie ich eben brauche.

Sinnvoll ist es diesen „Größen“ einen gut aussagekräftigen Namen zu geben. Sonst verliert man schneller den Überblick, als WP diese Thumbs erzeugt ;)

//my postthumb size 
if ( function_exists( 'add_theme_support' ) ) {
	add_theme_support( 'post-thumbnails' );
        set_post_thumbnail_size( 250, 9999 ); // default Post Thumbnail dimensions   
}

if ( function_exists( 'add_image_size' ) ) { 
	add_image_size( 'category-thumb', 75,75,true ); //300 pixels wide (and unlimited height)
	add_image_size( 'blogpage-thumb', 300, 198, true ); //(cropped)
	add_image_size( 'frontpage-thumb', 590, 197, true ); //(cropped)
	add_image_size( 'frontsmall-thumb', 75, 75, true ); //(cropped)

}

In diesem Beispiel habe ich nun categor, blogpage, frontpage und frontpagesmall thumbs.

WordPress erzeugt diese Bilder sofort.

Die Verwendung im Theme

Wenn Du das Thumb verlinken magst, musst du den Link drumherum geben und auch noch das HTML das du brauchst..
aber das Bild an sich holst du so

 <?php the_post_thumbnail( 'blogpage-thumb' );?>

oder so…

 <?php the_post_thumbnail( 'frontsmall-thumb' );?>

Wo du dies in dem Loop einbauen musst ist je nach Theme unterschiedlich.

Bilder in der falschen Größe

Hast Du die Bilder in der „falschen“ Größe, brauchst du unbedingt dieses Plugin, wie Frank in einem Kommentar ganz richtig anmerkte. => regenerate Thumbnails von Alex Mills auch als Viper007Bond bekannt und ein sehr guter und erfahrener PluginAutor.

Und ja… mehr gibts nicht

Viel Freud und wars hilfreich – wie immer freu ich mich über ein +1 oder Weitersagen
11

11 Beiträge zu “Artikelbilder in unterschiedlichen Größen erzeugen und je nach Bedarf dann verwenden

  1. Kommentar Autor
    Bernd
    Kommentar

    Allerdings hat die nachträgliche Erweiterung um zusätzliche Thumbnail- und Bildgrössen nur Auswirkungen auf Bilder, die *nach* der Erweiterung hinzugefügt werden. Will man – z.B. wegen eines Wechsels des Themes oder nach einem Theme-Umbau die neuen Grössen auch bei bereits existierenden Bildern anwenden, sollte man sich Plugins wie z.B. https://wordpress.org/plugins/ajax-thumbnail-rebuild/ anschauen, mit der sich bereits existierende Bilder in den neu hinzugefügten Grössen erzeugen lassen.

  2. Kommentar Autor
    Monika
    Kommentar

    super danke, @ Frank

    auf das habe ich einfach nicht gleich gedacht => geb ich ungern zu, war aber so,
    ich werde dies sogleich wie ich wieder 10Minuten Luft habe, oben im Artikel erweitern

    => wer weitere gute INFo dazu hat … ich habe Platz :-)

  3. Kommentar Autor
    Salim
    Kommentar

    Hallo Monika,

    vielen Dank für diesen Artikel. Für ein Projekt in Arbeit brauche ich genau diese Funkition. Zwar hatte ich das schonmal „irgendwann irgendwie“ gelöst, aber wenn ich nun nach dem Update auf 3.5 neue Bilder hochlade, wird mir anstelle des Originalbildes auch nur noch ein Thumb angezeigt.

    Deine Erklärung zur Verwendung der verschiedenen Größen ist so simpel, dass ich jetzt das System einfach nochmal neu aufziehe, anstelle ewig nach dem Fehler zu suchen. Super!

    Gruß
    Salim

  4. Kommentar Autor
    get4
    Kommentar

    Hallo,
    habe die Funktionen schon in einigen Themes die ich erstellt habe eingebunden. Ist so ja auch eine Super Sache, allerdings immer bei den Beitrags und Seitenbilder.
    Leider greift das add_image_size nicht bei mir bei Grafiken die ich über einen plupload einbinde für die Seite. Da für gibt es ja dann das set_post_thumbnail_size, nur was mache ich wenn ich auch von den pluploads mehrere Größen brauche / die 150×150 zu einer anderen größe weiter beibehalten will.
    Gruß
    Oliver

  5. Kommentar Autor
    get4
    Kommentar

    … Nachtrag > Mein Fehler wegen Größen die über meinen Bild lagen. Es greift natürlich auch beim plupload, was mir aufgefallen ist nachdem ich noch mal die Functions durch ging.

    schönen Gruß
    Oliver

  6. Kommentar Autor
    Monika
    Kommentar

    Oliver keine Ursache, freut mich, wenn die Größen für die Thumbs auch bei Deinem WP greifen

  7. Kommentar Autor
    chris
    Kommentar

    Das ist ja eine tolle Code-Hilfe für eigene Bildgrössen! Danke!
    Ich werde ihn einfügen, wenn demnächst unsere Gallerie erstellt wird.

    Nur, was macht dann die WordPress- Mediathek mit den drei von ihr angelegten Bildergrössen? Nichts?!
    was läuft denn technisch im Hintergrund ab, dass wirklich meine Bildgrössen eingebunden werden können?
    Ich stehe mit den Mediatheken 3.5 und 3.6 auf Kriegsfuß und möchte sie am liebsten außen vor halten, mit eigenem Code oder einem guten Plugin.

    Chris

  8. Kommentar Autor
    Monika
    Kommentar

    Du hast mit der Mediathek und mit den Angaben aus diesem Artikel alles was du brauchst…
    ich habe den Code für die Templates ja dazugeschrieben :-)

  9. Ping Wie TinyMCE deine Performance-Optimierung austricksen kann | Texto.de - Mein WordPress Magazin