WordPressでアイキャッチ画像を自動で設定する話

こんにちは。
最近朝起きると目が開かない武田です。

花粉症でしょうか・・・
最近開けようと思ってもなかなか開けられません。
目薬の使用頻度も上がってきました。

目といえば、視覚。
五感の中でも視覚の情報量は87%とかなりの情報量だそうです。
視覚でうったえかけることはとても重要そうですね。

みなさんはwordpressでアイキャッチ画像、設定していますか?
今回は自動でアイキャッチに設定する方法をご紹介します。

 

アイキャッチ画像はこれ

いろいろ方法を見てみると$postから抜き出して、
正規表現で最初のimg要素を取り出す方法を多く見かけるのですが、
画像のサイズが指定できなかったりと、使いづらさを感じていました。

Codexに使い方がありましたので、
投稿に添付された画像を取り出して、サイズを指定して表示したいと思います。
http://wpdocs.osdn.jp/関数リファレンス/get_children

画像表示用の関数を作る

functions.phpに以下の関数を追加します。
※変数名やファイル名などは適宜変更してください。

 

アイキャッチ画像の設定してあるか確認

has_post_thumbnail()でアイキャッチ画像が設定してあるかを確認します。
設定してあれば、「$image」に画像のパスを渡します。

wp_get_attachment_image_src()でサイズを指定してパスを渡しています。

 

get_children()で画像情報を取得

get_children()で画像情報を取得します。
今回はアイキャッチ画像用なので、取得する画像は最初1枚でOK。
「numberpost」に「1」を指定しています。
また、ファイルではなく画像のみを取得したいので、「post_mime_type」は「image」です。

 

投稿に画像がない場合は代替画像を使用

もちろん投稿に画像をアップロードしない場合もあるでしょう。
その場合は画像が表示されなくなってしまうため、
「$image」に画像URLが入っているか確認し、入っていなければ、代替画像を設定します。

 

画像を呼び出す

あとはループ内で関数を呼び出してあげれば画像のURLが表示されます。
img要素のsrcなどで使いましょう。

アイキャッチ画像を指定したければ設定しよう

この方法だと、「最初の画像」は投稿に一番最初にアップロードされたものになります。
アイキャッチにしたい画像が決まっているのであれば、
素直に管理画面からアイキャッチ画像を設定することをおすすめします。

この記事を書いた人

武田 ヒロキ

Webデザイナー/ディレクター
Web関連をメインに担当しています。データにちょっとうるさい。
ドアを開けるときは右手で開けて右手で閉める派