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

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

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

https://neatdesignjournal.com/wordpress-eycatch-img-vol1/

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

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

Download Free Stock Photos, Pictures & Images | Vecteezy

Explore millions of high quality, royalty free photos and pictures! Get the perfect background, nature, business, food or abstract photo for your design.

https://www.vecteezy.com/free-photos?utm_campaign=redirect&utm_medium=referral&utm_source=photopin

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

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

Photo Pin Photo Pinは商用/非商用で利用可能な写真を専門に検索してくれるサイト。 キーワードを入力して表示されるサムネイル画像をクリックすると、画像のダウンロードリンクが表示されます。...

http://kenz0.s201.xrea.com/weblog/2012/01/photo_pin.html

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

https://sedoriplan.com/how-to-use-photopin/

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

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

R7.5.5追記
サイトが閉鎖されていたためリンクを削除しました。

私が思ってるまま、やりたいことがズバッと書かれてあり、目から鱗でした。私の場合、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の写真は使い放題です（笑）人様の写真を勝手に使うのはイケナイことなので、皆さんもきちんと設定をして注意しましょう。