WordPressの関数を少しずつまとめていきます。
今回は、アイキャッチ画像を出力する関数「the_post_thumbnail」です。

基本的な使い方

アイキャッチ画像を出力する関数です。

パラメータ(1)サイズ、(2)クラス名を指定
戻り値無し
利用箇所WordPressループ内

パラメータを指定しない場合の記述は以下となります。

<?php the_post_thumbnail(); ?>

has_post_thumbnail」関数とセットで使用。
投稿にアイキャッチ画像が有るか否かを確認し、有る場合は画像を表示。

<?php if (has_post_thumbnail()): ?>
 /* 投稿にアイキャッチ画像が有る場合の処理 */
 <?php the_post_thumbnail(); ?>
<?php endif; ?>

*アイキャッチ画像を有効にするには、
functions.phpに「 add_theme_support( ‘post-thumbnails’ ); 」の記述が必要となります。

the_post_thumbnail 関数の応用:アイキャッチ画像を「メディア設定」のサイズに表示する

1つ目のパラメータで文字列を記述することにより、アイキャッチ画像を「メディア設定」どおりのサイズに表示します。

WordPressの「設定」→「メディア」で設定、設定しなければデフォルト値で表示されます

また、指定サイズよりも元画像が小さい場合は、元画像のサイズで表示されます。

文字列サイズ
thumbnail「サムネイル」で指定したサイズ
デフォルト:150px x 150px(最大値)
medium「中サイズ」で指定したサイズ
デフォルト:300px x 300px(最大値)
large「大サイズ」で指定したサイズ
デフォルト:640px x 640px(最大値)
full画像の元サイズ

「サムネイル」で設定したサイズで表示する

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

the_post_thumbnail 関数の応用:アイキャッチ画像を任意のサイズに表示する

1つ目のパラメータで、アイキャッチ画像を任意のサイズに指定することも可能です。

指定サイズよりも元画像が小さい場合は、元画像のサイズで表示されます。

横「200px」縦「150px」で表示する

<?php the_post_thumbnail( array(200,150) ); ?>

the_post_thumbnail 関数の応用:アイキャッチ画像にクラス名を付与する

2つ目のパラメータで、アイキャッチ画像にクラス名を付与することも可能です。

クラス名「icatch」を指定する

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