the_post_thumbnail()


WordPressのthe_post_thumbnail()関数は、投稿やページに設定されたアイキャッチ画像を表示するために使用されます。

構文

the_post_thumbnail( string|array $size = 'post-thumbnail', string|array $attr = '' );

引数の説明:

  • $size(string|array) — 画像サイズを指定します。デフォルトは’post-thumbnail’です。
  • $attr(string|array) — imgタグに追加する属性を指定します。

例1: 基本的なアイキャッチ画像の表示

投稿に設定されたアイキャッチ画像を表示します。

<?php the_post_thumbnail(); ?>

例2: カスタムサイズでのアイキャッチ画像の表示

アイキャッチ画像をカスタムサイズで表示します。

<?php the_post_thumbnail( 'medium' ); ?>

例3: アイキャッチ画像にクラスを追加

アイキャッチ画像にカスタムクラスを追加します。

<?php the_post_thumbnail( 'thumbnail', array( 'class' => 'custom-class' ) ); ?>

例4: アイキャッチ画像にalt属性を追加

アイキャッチ画像にalt属性を追加します。

<?php the_post_thumbnail( 'full', array( 'alt' => 'サンプル画像' ) ); ?>

例5: アイキャッチ画像をリンク付きで表示

アイキャッチ画像を投稿のパーマリンクにリンクさせて表示します。

<?php if ( has_post_thumbnail() ) : ?><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a><?php endif; ?>

例6: アイキャッチ画像がない場合の代替画像を表示

アイキャッチ画像が設定されていない場合、代替画像を表示します。

<?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } else { echo '<img src="default-image.jpg" alt="デフォルト画像">'; } ?>

注意点

  • アイキャッチ画像が設定されていない場合、何も表示されません。
  • 画像サイズを指定する際は、テーマで定義されたサイズか、WordPressのデフォルトサイズ（thumbnail, medium, large, full）を使用します。

関連機能：