Neat Design Journal

昨日のエントリーに引き続き、WordPressのアイキャッチ画像に関するあれこれの2回目です。今日は、アイキャッチに使える写真素材サイトのご紹介と、アイキャッチ画像のキャプションについてエントリーしたいと思います。

WordPressでアイキャッチ画像を利用する方法

WordPressでアイキャッチ画像を使えるようにするために必要なことについて調べてみました。

アイキャッチ画像に使える写真サイト

私の場合、iPhoneアプリを紹介する際にはiPhoneでアイキャッチ画像を作成していますが、もちろんアプリ紹介だけがブログの記事ではありませんので、それ以外の記事に使うアイキャッチ画像はインターネット上で探しています。現在私がメインで使っているサイトが以下です。

PhotoPin - Free Photos for Bloggers via Creative Commons

超有名かと思います。画像の取得方法などは他のブロガーの方々がエントリーしていらっしゃいますのでココでは割愛します。参考までにどうぞ。

Photo Pin : ブロガーのための転載可能な写真が探せる検索サイト - K'conf

ブログ記事に使える綺麗な無料写真 photopinの使い方 - Sedori Plan

クレジット表記をどうするか

画像のキャプション部分にクレジットをコピペするところまでは分かったんですが、どうやったらそれが表示されるのか、ここで結構悩んでしまいました。記事を書く時にその都度書き入れるのもいいんですが、せっかく画像をアップロードする時にキャプション部分に入れるんだったらそれで完結したい。ということでGoogle先生に問いかけたところ、以下の記事を見つけましたのでご紹介します。

WordPress アイキャッチ画像を使う上での注意点いろいろ（キャプション、RSS 関係） | Simple Living

私が思ってるまま、やりたいことがズバッと書かれてあり、目から鱗でした。私の場合、divでくくるのは少し違和感があったのでpタグで囲むようにしました。また、class名も「post-thumbnail-caption」から「eyecatchimg-caption」という風に自分が分かりやすいものに変更しました。こういう細かいところに拘るのが実は大好きだったりします（笑）結果、以下のようなコードになりました。

<?php the_post_thumbnail(); echo'<p class="eyecatchimg-caption">'.
get_post( get_post_thumbnail_id() )->post_excerpt.'</p>'; ?>

あとはCSSで文字の大きさや色を自分好みに変更すればいいわけです。hirose（@shirose_jp）さん、ありがとうございました！

最後に

これできちんとクレジット表記ができるようになりましたので、Photo Pinの写真は使い放題です（笑）人様の写真を勝手に使うのはイケナイことなので、皆さんもきちんと設定をして注意しましょう。