PehBehBeh

Erfahrungen eines Hobby-Webentwicklers

WordPress: Thumbnails im RSS-Feed anzeigen

| 8 Kommentare

Ich schrieb bereits einen ausführlichen Artikel über Thumbnails in WordPress 2.9. Seit ein paar Tagen benutze ich diese auch hier im Blog. Heute habe ich mir zur Aufgabe gemacht, dass die Thumbnails auch in meinem Feed angezeigt werden. Dazu ist mal wieder ein simpler Content-Filter notwendig.


Der Filter

Zunächst der Filter:

1
2
3
4
5
6
7
function my_feed_thumbnail($content) {
    if (is_feed() && has_post_thumbnail()) {
        return the_post_thumbnail() . $content;
    }
    return $content;
}
add_filter('the_content', 'my_feed_thumbnail');

Hier wird überprüft, ob wir uns im RSS-Feed befinden. Falls dies der Fall ist und zusätzlich noch ein Thumbnail gesetzt wurde, wird der Thumbnail an den Anfang des Contents gehängt. Fertig.

Design anpassen

Letztens kam eine Frage in den Kommentaren auf, wie man denn den Thumbnail links neben dem Text positionieren kann. Ganz einfach: mit CSS. Jeder Thumbnail hat die CSS-Klasse attachment-post-thumbnail. Im Blog lässt sich das also ganz einfach über die style.css-Datei eures Themes anpassen.

Der folgende Teil des Artikels ist veraltet.
Mittlerweile habe ich eine bessere Anleitung veröffentlicht, in der beschreiben wird, wie man den WordPress RSS-Feed mit CSS verschönern » kann.

Im Feed müssen CSS-Regeln jedoch in jeden Artikel eingepflegt werden. Man könnte diese jetzt noch zum letzten Filter hinzufügen. Ich habe mir jedoch einen eigenen Filter für CSS-Regeln im Feed erstellt. So habe ich die Möglichkeit, in Zukunft alles an einem Platz einzufügen, wenn ich noch weitere Dinge im Feed anpassen möchte.

Hier nochmal mein derzeitiger CSS-Filter für den Feed:

1
2
3
4
5
6
7
8
9
10
11
12
function my_feed_css($content) {
    if (is_feed()) {
        $css  = '<style>';
        $css .= '.attachment-post-thumbnail { float: left; padding: 6px; margin: 0 6px 6px 0; border: 6px solid #eee; }';
        $css .= '.more { clear: both; }';
        $css .= '</style>';
 
        return $css . $content;
    }
    return $content;
}
add_filter('the_content', 'my_feed_css');

Wie man sieht, habe ich noch eine zweite Regel für meinen ersetzten more-Tag (horizontale Linie), den ich so anpassen musste, dass die Linie nicht neben meinem Thumbnail beginnt, sondern erst darunter.

Das Ergebnis könnt ihr euch anschauen, wenn ihr meinen Feed abonniert. 😉

Dir hat der Artikel gefallen?
Dann abonniere doch den RSS-Feed!
  • Hallo Phil,

    hast du die funcion auch in die functions.php intigriert? Direkt nach dem eigentlichen Thumbnail?

    Bei mir scheint es jedenfalls nicht zu laufen. Stattdessen kommen die CSS-Anweisungen direkt in den Feed… Beispiel:

    .attachment-post-thumbnail { float: left; padding: 6px; margin: 0 6px 6px 0; border: 6px solid #eee; }.more { clear: both; }Die Meldungen der Polizeidirektion Calw von Mittwoch, 1. September (laufend aktualisiert).
    BAD WILDBAD-CALMBACH. Zu einem Unfall kam es [… usw. …]

    Danke im Voraus für deine Hilfe und nachträglich für die Thumb Anleitung. =)

  • Hallo Pascal,
    den Filter my_feed_css() habe ich bei mir auch wieder entfernt, da nicht alle Reader mit en CSS-Angaben klarkommen.
    Ich suche auch noch eine bessere Lösung… wenn ich eine habe, werde ich sie hier im Blog veröffentlichen.

  • Hallo Phil,

    eine Sache noch… so aus „gegebenem Anlass“ 😉

    In unserer functions.php steht jetzt im Gesamten:


    if (function_exists('add_theme_support')) {
    add_theme_support('post-thumbnails');
    set_post_thumbnail_size(150, 150);
    add_image_size('thema1', 600, 600);
    add_image_size('thema2', 190, 190, true);
    }
    function my_feed_thumbnail($content) {
    if (is_feed() && has_post_thumbnail()) {
    $css = '';
    $css .= '.attachment-post-thumbnail { float: left; padding: 6px; margin: 0 6px 6px 0; border: 6px solid #eee; }';
    $css .= '.more { clear: both; }';
    $css .= '';

    return the_post_thumbnail() . $content;
    }
    return $content;
    }
    add_filter('the_content', 'my_feed_thumbnail');

    Leider bin ich in PHP noch nicht ganz fit.
    Bedeutet das, dass in jedem RSS Feed automatisch ein Thumbnail eingefügt wird oder nicht?
    Das Problem: Ein Artikel, den wir früher veröffentlicht hatten und mit Artikelbild „nachträglich“ wieder auf Platz 1 positioniert wurde, zeigt sein Feed Thumbnail nach wie vor nicht. Ist das normal oder streicht WP da paar Thumbnails?

    Sorry und Danke für deine Bemühungen 😉 . Grüße natürlich auch.

  • Also zunächst zu deinem Schnipsel: Alles was du in der Variable $css ablegst, ist noch unverwendet. Du müsstest es in der return-Zeile hinzufügen:

    return $css . the_post_thumbnail() . $content;

    Jedoch würde ich dir, wie gesagt, davon abraten, weil nicht jeder Feed-Reader mit CSS-Styles zuerchtkommt.

    Ansonsten bedeutet der Code, dass ein Thumbnail im Feed vor jedem Artikel angezeigt wird (sofern einer vorhanden ist). Woran es liegt, dass der THumbnail bei den älteren Artikeln, die nach vorne geholt werden, nicht angezeigt werden, kann ich dir nicht genau sagen. Wenn sie ein Thumbnail besitzen, sollte dies eigentlich angezeigt werden… hatte der Artikel früher kein Thumbnail? Kann ja sein, dass da noch der Artikel ohne Thumbnail irgendwo im Cache ist vielleicht?

  • Habe es jetzt so gelöst:

    function my_feed_thumbnail($content) {
    if (is_feed() && has_post_thumbnail()) {
    $style = 'float: left; padding: 6px; margin: 0 6px 6px 0; border: 6px solid #eee;';
    return the_post_thumbnail('post-thumbnail', array('style' => $style)) . $content;
    }
    return $content;
    }
    add_filter('the_content', 'my_feed_thumbnail');

    Funktioniert einwandfrei. Ich werde in den nächsten Tagen den Atikel updaten…

  • Ich habe mittlerweile einen neuen Artikel geschrieben, in dem ich darauf eingehe, wie man WordPress RSS-Feeds mit CSS verschönern kann.

    Der Artikel oben wurde aktualisiert.

  • Pingback: 10 praktische Tools zum Bloggen mit WordPress: SEO, Google-News & Theme-Hacks | Berufebilder by Simone Janson()

  • Pingback: 10 praktische Tools zum Bloggen mit WordPress: SEO, Google-News & Theme-Hacks | B E R U F E B I L D E R - Simone Janson()