通常、アイキャッチ画像を出力する際はthe_post_thumbnail()を使いますが、the_post_thumbnail()だとimg要素も一緒に出力されます。
そうではなく、画像のURLのみを取得したいというケースもあるかと思いますので、アイキャッチ画像のURLのみを取得して出力する方法をご紹介したいと思います。
WordPressでアイキャッチ画像のURLを取得して出力する方法
アイキャッチ画像のURLを取得するには、wp_get_attachment_image_src()を使います。
<?php $thumb = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'large'); ?> <img src="<?php echo $thumb[0]; ?>" width="<?php echo $thumb[1]; ?>" height="<?php echo $thumb[2]; ?>" alt="">
このように、wp_get_attachment_image_src()で投稿IDとサイズを指定して、$thumbに代入します。投稿IDはget_post_thumbnail_idを使って、開いている投稿のIDを取得するようにしています。
あとはimg要素内でsrc属性に出力するだけですが、上記で$thumbに代入される値は以下のようになっています。
- $thumb[0]：画像URL
- $thumb[1]：画像の横幅
- $thumb[2]：画像の高さ
- $thumb[3]：リサイズの有無
そのため、画像URLを出力する時は、$thumb[0]を指定して出力します。
あとがき
私が画像URLを取得するケースとしては、lightbox系のプラグインを使って画像を拡大表示する際に、リンク先に画像URLを入れるために活用しています。
同じようにアイキャッチ画像のURLを取得・出力したい場合は、ぜひ参考にしていただけると幸いです。
なお、get_the_post_thumbnail_url()を使ったURLの取得方法もあります。詳しくは、こちらの記事をご参照ください。