WordPress Logo

今日はWordPressのアイキャッチ画像のURLだけを取得・表示させる方法を紹介します。

通常アイキャッチ画像を表示させる際は <?php the_post_thumbnail(); ?> を使いますね。

実践的にはアイキャッチ画像が登録されているか否かを調べてから出力させるので、さらに has_post_thumbnail>関数を用いて次のように記述します。

<?php
if ( has_post_thumbnail() ) {
	the_post_thumbnail();
}
else {
	echo '<img src="' . get_bloginfo( 'template_directory' ) . '/images/thumbnail.png">';
}
?>

これだと<img>タグごと出力されてしまうのですが、どうにかしてsrc属性の中身の画像URLだけを表示させたい。
……そんなときは「wp_get_attachment_image_src」と「get_post_thumbnail_id」を利用します。

wp_get_attachment_image_src()
登録したアイキャッチ画像のパスやサイズを配列で返してくれる。
get_post_thumbnail_id()
アイキャッチ画像のIDを取得

なおwp_get_attachment_image_src()で取得できる配列の中身は以下のとおり。

[0] => url
[1] => width
[2] => height

画像の「URL」「幅」「高さ」が格納されています。
つまり次のようなコードを書けばアイキャッチ画像のURLだけを出力できるワケです。

<?php if ( has_post_thumbnail() ) {
	$image_id = get_post_thumbnail_id ();
	$image_url = wp_get_attachment_image_src ($image_id, true);
	echo $image_url[0];
} else {
	echo get_bloginfo( 'template_directory' ) . '/images/thumbnail.png';
} ?>

簡単にできましたね！