【WordPressでアイキャッチ（サムネイル）を扱う関数について、知りたくて調べた】

WordPress

最近のWordPressのテーマにはアイキャッチ（サムネイル）の使用は当たり前になっていますね。もし、ご使用のWordPressテーマでアイキャッチが使えない、という場合には、アイキャッチを使えるように「functions.php」のファイルに、

add_theme_support('post-thumbnails');

を追加すれば、すぐにでもアイキャッチを使えるようになります。

ところで、アイキャッチって、投稿やページに割り当てることによって視覚的に引きつけることもできますし、長々とした記事があったとして、その要約として使うことが出来るな～、なんて思っています。また、ほとんどアイキャッチ頼りの記事などにも使えますし。これもアリじゃないかと思っています。

  • 面白い画像、キレイな女性の画像で興味を惹いてやる。
  • 無意識に目に入る情報を最大限に利用してやる！

なんて思惑が見え隠れする記事って、私は好きです。

そんな用途で使うこともこれからあるだろうと思うんで、私のブログもアイキャッチは諸処で使われてるんですけど、そもそもアイキャッチに関わるWordPress関数ってどれくらいあるんだ？と興味がわきまして、調べてメモっておこうかと思いました。

後で見直しても理解できるようにしておこう・・・

４つのアイキャッチを扱う関数

私が調べたところ、4つあるようです。

  1. has_post_thumbnail
  2. the_post_thumbnail
  3. get_the_post_thumbnail
  4. get_post_thumbnail_id

（他にもあるかも・・・ご存知でしたらご教示くださいますと嬉しいです）ひとつずつさらっと書きましたんで、お時間ありましたらご覧下さい。

１．has_post_thumbnail

投稿や、ページにアイキャッチ画像が割り当てられているかどうかを調べることができます。どうやら、通常はWordPressループの中で使用するとのことです。

【アイキャッチがあるかどうかを判別する】

<?php if( has_post_thumbnail() ) : ?>
 あるよ　//アイキャッチがあるときの処理
 <?php else : ?>
 ないよ　//アイキャッチがないときの処理
<? endif ; ?>

２．the_post_thumbnail

アイキャッチ画像を出力する関数ですね。これをさっきの「has_post_thumbnail」関数と組み合わせれば、アイキャッチがあるとき、ないときで以下のことができます。

【アイキャッチがあるかどうかで、表示させる画像を分ける】

<?php if( has_post_thumbnail() ) : ?>
 <?php the_post_thumbnail( array(90,90),array( 'alt' => $title_attr , 'title' => $title_attr )); ?>
 //アイキャッチがあるとき、90×90のサイズで表示
 <?php else : ?>
 <img src="<?php bloginfo('template_directory'); ?>/images/no_thumb.jpg"
 //アイキャッチがないときは、代わりの画像を表示（no imageとか、よくありますよね。あれです）
 <? endif ; ?>

これはあくまで例なので、使い方はいろいろですね。たぶん、WordPressを触っておられる方はこの「the_post_thumbnail」関数をよく使う場面に遭遇すると思います。

もうちょっと詳しく書きます

「the_post_thumbnail」には、配列arrayとして値を設定できます。以下のコードをご覧下さい。

<?php the_post_thumbnail( $size, $attr ); ?>

カッコ内（）を個別に見ましょう～。

$size　→　アイキャッチの画像サイズ

テンプレートタグ/the post thumbnail | 日本語Codex　を見ると、

the_post_thumbnail();                  // パラメータなし -> サムネイル
the_post_thumbnail('thumbnail');       // サムネイル
the_post_thumbnail('medium');          // 中サイズ
the_post_thumbnail('large');           // 大サイズ
the_post_thumbnail( array(100,100) );  // 他のサイズ

と、設定できると。

the_post_thumbnail( array(100,100) );

の場合は、100×100ピクセルのアイキャッチを表示ですね。出ました、ここです。今回特にメモっておきたいところです。アイキャッチのサイズについて。以下覚えておくとちょっと役に立ちます。

例を交えてご説明しますね。

【例１：どちらか小さい方の値を基準とされる】

the_post_thumbnail( array(1000000,80) );　→　これは80×80で表示される

極端な例ですけどね。

【例２：元々指定してあるアイキャッチのサイズが、160×240だった場合】

the_post_thumbnail( array(300,300) );　　→　これは160×160で表示される

上の2つの例が知りたくて、今回の記事を書くきっかけになりました。一度知ってしまえば忘れないだろうとは思うんですが、あんまり自分の記憶を信用していないので、念のためです。ここだけ書けばいいじゃない・・・って思うかもしれませんが、なんか調べていくうちにだんだん書くことが増えてしまいました＾＾；というわけで、もう１つの値「attr」について。

$attr　→　任意で指定できる

私の場合はここにさらに配列で、altとtitleの値を指定して出力しました。

３．get_the_post_thumbnail

ここからはさらっと。codexの内容を多く（ほとんど）引用させていただいています。

テンプレートタグ/get the post thumbnail | 日本語Codex

<?php echo get_the_post_thumbnail( $id, $size, $attr ); ?>

値を3つ設定できます。

  • $id　→　投稿ＩＤ
  • $size　→　アイキャッチの画像サイズ（the_post_thumbnailと同じ要領で指定できる）
  • $attr　→　任意で指定できる

【サンプルコード】

<?php $pages = get_pages(array('child_of' => 1)); ?>
 <ul>
 <?php foreach ($pages as $page): ?>
 <li>
 <?php echo get_the_post_thumbnail($page->ID, 'thumbnail'); ?>
 <h1><?php echo $page->post_title; ?></h1>
 <?php echo $page->post_content; ?>
 </li>
 <?php endforeach; ?>
 </ul>

えっと・・・後で試すか～

４．get_post_thumbnail_id

codexの情報をまたまたお借りします「get_post_thumbnail_id 」

投稿のアイキャッチ画像(投稿サムネイル)がセットされている場合は、アイキャッチ画像の ID を返す。

サムネイルだけでなく全てのアタッチメントを取得するために、get_posts()のように使用することができます。

サムネイルだけでなく全てのアタッチメントを取得する

ループ内 ($post->ID が利用できる状態)で使用してください。

 

【サンプルコード】

<?php　$args = array(
 'post_type' => 'attachment',
 'numberposts' => -1,
 'post_status' => null,
 'post_parent' => $post->ID,
 'exclude' => <strong>get_post_thumbnail_id</strong>()
 );
 $attachments = get_posts($args);
 if ($attachments) {
 foreach ($attachments as $attachment) {
 echo apply_filters('the_title', $attachment->post_title);
 the_attachment_link($attachment->ID, false);
 }
 }
 ?>

アイキャッチ画像のID取得だけではないということですかね。

使う機会があったら試します。

まとめ

アイキャッチを扱う関数のご紹介でした。

アイキャッチの画像サイズの扱いについて仕様がわからない、という方にご参考いただければ幸いです。

著者:bouya Imamura