この記事は最後に更新してから1年以上経過しています。

フィードにサムネイル画像を追加する

ありがとうSimplePie

説明

WordPressが出力するの標準のフィードには、各投稿のサムネイル画像の情報が含まれていない。ネットで検索してみるといくつかの方法があることがわかったので、その中から2つ試してみた。

enclosure要素を使う

WordPress標準のフィード（RSS 2.0準拠）で対応する場合はenclosure要素を使う方法がある。enclosure要素は標準では使用されておらず、'rss2_item'アクションを使うことで追加できる。ソースコードは以下の通り。

add_action( 'rss2_item', 'rss2_item_thumbnail' );

function rss2_item_thumbnail() {
	if ( has_post_thumbnail() ) {
		global $post;
		$thumbnail_id = get_post_thumbnail_id( $post->ID );
		$meta         = wp_get_attachment_metadata( $thumbnail_id );
		$image_url    = wp_get_attachment_url( $thumbnail_id );
		$image_url    = str_replace( wp_basename( $image_url ), wp_basename( $meta['sizes']['thumbnail']['file'] ), $image_url );
		$image_file   = get_attached_file( $thumbnail_id );
		$image_file   = str_replace( wp_basename( $image_file ), wp_basename( $meta['sizes']['thumbnail']['file'] ), $image_file );
		$image_size   = filesize( $image_file );
?>
<enclosure url="<?php echo esc_url( $image_url ); ?>" length="<?php echo esc_attr( $image_size ); ?>" type="<?php echo esc_attr( $meta['sizes']['thumbnail']['mime-type'] ); ?>" />
<?php
	}
}

上記を適用したフィードのitem要素には、次のようなenclosure要素が追加される。

<enclosure url="http://localhost/wp-content/uploads/2022/10/img202210-150x150.jpg" length="6059" type="image/jpeg" />

enclosure要素にはurl（HTTP URL）、length（ファイルサイズ）、type（MIMEタイプ）の3属性があり、仕様上これらすべては必須である。

このフィードを読み込む側（WordPress）は、（ザックリ）次のような感じになる。

$rss = fetch_feed( 'http://localhost/feed/' );
$list_posts = [];
if ( ! is_wp_error( $rss ) ) {
	$list_posts = $rss->get_items( 0, $rss->get_item_quantity( 10 ) );
}
if ( ! empty( $list_posts ) ) {
	foreach ( $list_posts as $item ) {
		var_dump( $item->get_enclosure() );
	}
}

enclosure要素のデータはget_enclosureメソッドを使って取得できる。取得したSimplePie_Enclosureオブジェクトには多くのプロパティがあり、関連するものは次の通り（抜粋）。

object(SimplePie_Enclosure)#5121 (27) {
  ["length"]=>
  int(6059)
  ["link"]=>
  string(64) "http://localhost/wp-content/uploads/2020/05/IMG_0207-150x150.jpg"
  ["thumbnails"]=>
  NULL
  ["type"]=>
  string(10) "image/jpeg"
  :
}

linkプロパティにはurl属性値が、lengthとtypeプロパティには同名の属性値が格納されている。注意する点としては、フィード内にenclosure要素がない場合でもget_enclosureメソッドはエラーにならず、データの入っていないSimplePie_Enclosureオブジェクトを取得できる。enclosure要素の有無は、linkプロパティの値で確認する必要がある。

media:thumbnail要素を使う

今回紹介するもう1つはmedia:thumbnail要素を使う方法である。この対応には'rss2_item'アクションのほかに'rss2_ns'アクションを使用する。

add_action( 'rss2_ns', 'rss2_ns_thumbnail' );

function rss2_ns_thumbnail() {
?>
xmlns:media="http://search.yahoo.com/mrss/"
<?php
}

add_action( 'rss2_item', 'rss2_item_thumbnail' );

function rss2_item_thumbnail() {
	if ( has_post_thumbnail() ) {
		global $post;
		$thumbnail_id = get_post_thumbnail_id( $post->ID );
		$thumbnail    = wp_get_attachment_image_src( $thumbnail_id, 'thumbnail' );
		if ( isset( $thumbnail[0] ) && $thumbnail[0] ) {
?>
<media:thumbnail url="<?php echo esc_url( $thumbnail[0] ); ?>" width="<?php echo esc_attr( $thumbnail[1] ); ?>" height="<?php echo esc_attr( $thumbnail[2] ); ?>" />
<?php
		}
	}
}

上記を適用したフィードのitem要素には、次のようなmedia:thumbnail要素が追加される。

<media:thumbnail url="http://localhost/wp-content/uploads/2022/10/img202210-150x150.jpg" width="150" height="150" />

media:thumbnail要素のurl属性は必須、heightとwidth属性はオプションとなる（このほかにtime属性がある）。

get_enclosureメソッドを使ってこのフィードを読み込んだ場合、linkプロパティはNULLになり、thumbnailsプロパティの配列にサムネイル画像のURLが格納される。

object(SimplePie_Enclosure)#5121 (27) {
  ["length"]=>
  NULL
  ["link"]=>
  NULL
  ["thumbnails"]=>
  array(1) {
    [0]=>
    string(64) "http://localhost/wp-content/uploads/2022/10/img202210-150x150.jpg"
  }
  ["type"]=>
  NULL
  :
}

またget_enclosureメソッドの代わりにget_thumbnailメソッドも使用できる。

foreach ( $list_posts as $item ) {
	var_dump( $item->get_thumbnail() );
}

get_thumbnailメソッドで取得した内容は次のような連想配列となる。

array(3) {
  ["url"]=>
  string(64) "http://localhost/wp-content/uploads/2022/10/img202210-150x150.jpg"
  ["width"]=>
  string(3) "150"
  ["height"]=>
  string(3) "150"
}

ご覧の通り、get_thumbnailメソッドではurl属性の値だけでなく、widthとheight属性の値も取得できている。ただし注意しなければならないのは、get_thumbnailメソッドが使用できるのはWordPress 5.5以降ということ。WordPressのバージョンに応じてget_thumbnailメソッドとget_enclosureメソッドを使い分けることになる。

今回はフィードのitem要素にenclosure要素またはmedia:thumbnail要素を追加し、サムネイル画像のURLを埋め込んでみた。description要素内に入れ込む方法もあるようだが、まあこの2つのどちらかでよいのではないだろうか。

最終更新 : 2022年11月07日 10:16

お勧め

add_shortcode（2018年5月27日更新）

void add_shortcode( string $tag, mixed $func )

ショートコード（独自タグ）を追加する。ショートコードは、投稿記事内でテキスト内容がない[tag]や、テキストを内包する[tag]テキスト[/tag]の書式で使用できる独自タグのこと。標準の状態では、 the_content関数によって表示する直前のフィルター処理内でパラメータ$funcで指定した関数・メソッドが実行される。

get_user_setting（2022年1月31日更新）

mixed get_user_setting( string $name [ , string $default = false ] )

ユーザーインターフェイス設定を取得する。

have_posts（2018年5月27日更新）

bool have_posts( )

次の投稿データが存在するかを調べる。

in_category（2018年5月27日更新）

bool in_category( mixed $category [ , mixed $post = null ] )

投稿情報が指定したカテゴリーに属しているか調べる。

add_feed（2024年6月24日更新）

string add_feed( string $feedname, callable $callback )

フィードを追加する。