アイキャッチ画像（投稿サムネイル）を一覧や投稿ページに出力し表示させる方法

WordPressには、アイキャッチ画像（投稿サムネイル）を登録できる機能があり、一覧ページなどのサムネイル画像として使えてとても便利です。
以前、このアイキャッチ画像（投稿サムネイル）の機能を有効にする方法をご紹介したのですが、今回はその続き、アイキャッチ画像（投稿サムネイル）で登録した画像を一覧ページや投稿ページに表示する方法をご紹介します。

アイキャッチ画像（投稿サムネイル）を出力する方法
アイキャッチ画像（投稿サムネイル）が指定されているかを判別する方法
アイキャッチ画像（投稿サムネイル）のurlの取得方法

アイキャッチ画像（投稿サムネイル）を出力する方法

アイキャッチ画像（投稿サムネイル）を出力するには「the_post_thumbnail()」関数を使います。

//パラメータなし
the_post_thumbnail();                     

// サムネイル
the_post_thumbnail( 'thumbnail' );     
 // 中サイズ
the_post_thumbnail( 'medium' );           
// 大サイズ
the_post_thumbnail( 'large' );              
// フルサイズ
the_post_thumbnail( 'full' );
  
//サイズを数値で指定する場合
the_post_thumbnail( array( 100, 100 ) );

//パラメータなし

the_post_thumbnail();

// サムネイル

the_post_thumbnail( 'thumbnail' );

// 中サイズ

the_post_thumbnail( 'medium' );

// 大サイズ

the_post_thumbnail( 'large' );

// フルサイズ

the_post_thumbnail( 'full' );

//サイズを数値で指定する場合

the_post_thumbnail( array( 100, 100 ) );

WordPressで画像をアップロードすると’thumbnail’, ‘medium’, ‘large’, ‘full’といったサイズの画像が登録されます。（これらの画像サイズについては、管理画面の設定＞メディアで設定することができます。）
「the_post_thumbnail()」関数はアイキャッチ画像（投稿サムネイル）に表示する画像として、これらアップロードされた画像の中から最適なサイズの画像を指定することができます。

「the_post_thumbnail()」をパラメータなしで設定した場合は、テーマのfunctions.php などに、「set_post_thumbnail_size()」でアイキャッチ画像（投稿サムネイル）のデフォルトのサイズが指定されている場合はそのサイズ（‘post-thumbnail’）、ない場合はフルサイズ（‘full’）の画像が出力されます。

他の画像サイズを選択したい場合は、’thumbnail’, ‘medium’, ‘large’, ‘full’等サイズの名称を指定します。

「the_post_thumbnail( array( 100（横幅）, 100（縦幅） ) );」のようにサイズを数値(px)で指定した場合はアップロード時に登録された画像の中から指定されたサイズに近い画像が表示されます。

「the_post_thumbnail()」で出力された画像の「alt」には、メディアの「代替テキスト」で登録したワードが表示されます。

アイキャッチ画像（投稿サムネイル）が指定されているかを判別する方法

アイキャッチ画像（投稿サムネイル）の指定がある場合、ない場合を判別するには「has_post_thumbnail()」を使って条件分岐します。

<?php 
if ( has_post_thumbnail() ) {
	the_post_thumbnail();
}else{ ?>
        <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/noimage.jpg">
<?php } ?>

<?php

if ( has_post_thumbnail() ) {

the_post_thumbnail();

}else{ ?>

<img src="<?php echo get_stylesheet_directory_uri(); ?>/images/noimage.jpg">

<?php } ?>

このサンプルは、アイキャッチ画像（投稿サムネイル）の指定がない場合、テーマのimagesフォルダーに配置されているnoimage.jpgを代替えとして表示する設定になっています。

アイキャッチ画像（投稿サムネイル）のurlの取得方法

「has_post_thumbnail()」で指定したように<img>で出力させるのではなく、画像のurlだけ取得したい場合もあるかと思います。その場合は「wp_get_attachment_image_src」という関数を使います。

wp_get_attachment_image_src(画像のID, サイズ);

アイキャッチ画像（投稿サムネイル）画像のIDを取得するには「get_post_thumbnail_id()」を使います。
画像サイズには、’thumbnail’, ‘medium’, ‘large’, ‘full’等サイズの名称を指定します。

<?php
$thumbnail_id = get_post_thumbnail_id();//アイキャッチのID
$data = wp_get_attachment_image_src($thumbnail_id,'medium');//配列
?>
<img src="<?php echo $data[0] ;?>" width="<?php echo $data[1] ;?>" height="<?php echo $data[2] ;?>" >

<?php

$thumbnail_id = get_post_thumbnail_id();//アイキャッチのID

$data = wp_get_attachment_image_src($thumbnail_id,'medium');//配列