記事一覧やランキング表示など、投稿ループの中でアイキャッチ画像(サムネイル)を表示したい場面は多いですが、書き方が何パターンかあり混乱しがちです。目的別に使い分けを整理しておきます。

そのまま表示するだけなら the_post_thumbnail()

画像タグとしてそのまま出力したいだけなら、これが一番シンプルです。

<?php if ( has_post_thumbnail() ) : ?>
  <?php the_post_thumbnail( 'medium' ); ?>
<?php endif; ?>

has_post_thumbnail()で「そもそもアイキャッチが設定されているか」を先に確認しておくのがポイントです。これを省略すると、アイキャッチ未設定の記事で画像タグ自体が出力されず、レイアウトが崩れる原因になります。

URLだけ欲しいなら get_the_post_thumbnail_url()

CSSのbackground-imageに使いたい場合など、画像タグではなくURL文字列だけが欲しいケースもあります。その場合はget_が付く関数を使います。

<?php
$thumb_url = get_the_post_thumbnail_url( get_the_ID(), 'medium' );
?>
<div class="card" style="background-image: url('<?php echo esc_url( $thumb_url ); ?>');"></div>

<?php
$thumb_url = get_the_post_thumbnail_url( get_the_ID(), 'medium' );
if ( ! $thumb_url ) {
  $thumb_url = get_template_directory_uri() . '/images/no-image.jpg';
}
?>

まとめ

• 画像タグとしてそのまま表示するならthe_post_thumbnail()
• URL文字列だけ欲しいならget_the_post_thumbnail_url()
• アイキャッチ未設定の記事はfalseが返るので、デフォルト画像へのフォールバック処理を入れておくと安全