ワードプレスのテーマやプラグインから投稿のアイキャッチ画像をコードで取得する方法をご紹介いたします。PHPの知識がある程度必要な記事となっております。
アイキャッチ画像のURLを取得する
投稿のアイキャッチ画像を取得する基本的なコードは下記です。このコードは while ( have_posts() ) ループの内側にある必要があります。$eyecatch_urlという変数に画像のURLが代入されます。
$eyecatch_url = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()), 'thumbnail' );
任意の記事のアイキャッチ画像を取得するには下記のように記事のIDをget_the_ID()のところに入力します。この場合はループの内側にコードがある必要はありません。記事のIDは投稿一覧画面で編集リンクにマウスを合わせるとURLで調べることが可能です。
$eyecatch_url = wp_get_attachment_url( get_post_thumbnail_id(9999), 'thumbnail' );
画像のサイズを指定してURLを取得するには下記のように、二番目の変数に画像サイズを指定します。画像サイズは下記の４つから指定できます。
thumbnail, medium, large, full それぞれ、１５０ｐｘ、３００ｐｘ、１０２４ｐｘ、フルサイズ(元の画像サイズ) でURLに画像が代入されます。
$eyecatch_url = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()), 'large' );
下記のように画像の横幅縦幅を指定して、任意のサイズで読み込むこともできます。下記の例では６４０ｐｘ*４８０ｐｘで画像URLが$eyecatch_imageurlに代入されます。
$eyecatch_url = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()), array(640,480) );
アイキャッチ画像を表示する
次に上記で取得した画像を表示します。これはIMGタグのSRCにこのURLを指定するだけですので簡単です。このコードでアイキャッチ画像がLargeサイズでHTML出力されブラウザ上で表示されるようになります。
<?php $eyecatch_url = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()), 'large' ); ?> <img src="<?php echo $eyecatch_url; ?>" alt="">
アイキャッチ画像がある場合にのみ画像を表示するには、その条件式を付与します。if (has_post_thumbnail( get_the_ID() ) ): という条件式でその投稿に画像があるかどうかを調べてその場合にのみIMGタグを出力します。
<?php $eyecatch_url = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()), 'large' ); ?> <?php if (has_post_thumbnail( get_the_ID() ) ): ?> <img src="<?php echo $eyecatch_url; ?>" alt=""?> <?php endif; ?>
より詳しいアイキャッチ画像の情報を取得する
下記のようなコードで、アイキャッチ画像のURLと横幅高さも同時に取得できます
$eyecatch_data = wp_get_attachment_image_src( get_the_ID() , 'full' ); $eyecatch_url = $eyecatch_data[0]; //url $eyecatch_width = $eyecatch_data[1]; //横幅 $eyecatch_height = $eyecatch_data[2]; //高さ
投稿に含まれている最初の画像を取得する
最後にアイキャッチではなく、投稿に含まれている画像で一番初めに追加された画像URLを取得する方法をご紹介します。下記コードをループ内に記載することにより最初の投稿に含まれる画像が$firstimage_urlに代入されます。
$attachments = get_children(array('post_parent' => get_the_ID(),
'post_status' => 'inherit',
'post_type' => 'attachment',
'post_mime_type' => 'image',
));
if ( is_array( $attachments ) && !empty( $attachments ) ) {
$firstimage_url = wp_get_attachment_url( current($attachments) , 'full');
}
