ブログにおける「アイキャッチ」と「サムネイル」という言葉の違いがわかりますか。ブログの画像や写真は記事を引き立てるためにも重要な存在です。今回はこの違いと関連プラグインについてまとめてみました。
ゆめぴょんです。こんちはっ(^^)/
ブログ記事では文章の内容が一番大切だと言われます。そして適切な画像や写真を付けることにより、文章をより一層わかりやすくしたり、魅力的に見せたりすることが可能です。
アイキャッチとサムネイルの違い
ブログ作成の記事、特に画像の設定について読んでいると「アイキャッチ」や「サムネイル」という言葉がよくあらわれます。最初はわかってるつもりだったのに、慣れない人は混乱してくることでしょう。
「アイキャッチ」とは通常はブログ記事の最初に表示する画像で、記事内容をひと目で連想しやすくするために設置します。
「サムネイル」とは、アイキャッチ画像の縮小版です。記事の一覧を表示する場合などに、記事を象徴する画像として表示することが多いです。又はページのスクリーンショットの縮小版を指すこともあります。
ちなみに、アイキャッチ画像はわざわざ縮小（サムネイル化）しなくても利用することが可能です。しかし縮小した方が容量も転送量も小さくなるので、表示速度の高速化につながります。
だからアイキャッチを縮小したサムネイルが必要となるのです。WordPressには1つのアイキャッチ画像に対して、標準では3種類の大きさのサムネイルを自動生成する機能があります。
英語圏では、アイキャッチのことを「post thumbnail」（投稿サムネイル）や「Featured Image」と呼ぶようです。英語のプラグインの名称や設定でこのような項目名があれば、アイキャッチ画像のことだと思えばいいでしょう。
アイキャッチとサムネイルの作成方法
アイキャッチの作成方法
記事にアイキャッチを設定する方法は次の3通りあります。
- 記事の投稿画面でアイキャッチ画像をアップロードする
- 記事の投稿画面でアイキャッチ画像をメディアライブラリから選択する
- プラグイン「Auto Post Thumbnails」で自動的に一番最初の画像を設定
プラグイン「Auto Post Thumbnails」については下の記事も参考にしてみてください。
サムネイルの作成方法
まずサムネイル画像のサイズを指定する方法は2通りあります。
- WordPress管理画面「メディア」で3種類のサイズを指定できる
- テーマファイル「functions.php」でサイズを設定する
「1」はWordPress管理画面「設定」→「メディア」で「小」「中」「大」の3種類のサイズを指定できます。トリミングにチェックするとその大きさで切り取ります。「変更を保存」を忘れずに。
「2」はいくつでも自由に設定できます。例えば「middle」という名前で「横200x幅100」のサムネイル画像を作成したい場合は、functions.phpに次のように記述します。
[php]
add_image_size( ‘middle’, 200, 100 );
add_image_size( ‘middle’, 200, 100, true );
[/php]
2行目のように4つめの引数を「true」にすると、トリミング（切り取り）します。「false」か空白なら切り取らずに縮小します。
ちなみにこのサムネイル「middle」を表示したい場合は、HTMLに次のように記述するだけです。
[php]
<?php the_post_thumbnail(‘middle’); ?>
[/php]
そして上で指定したサイズのサムネイルは、次のタイミングで生成されます。
- アイキャッチを設定すると自動的に作成される
- プラグイン「Regenerate Thumbnails」でサムネイルを再生成
プラグイン「Regenerate Thumbnails」については下の記事も参考にしてみてください。
まとめ：今日のゆめぴょんの知恵
アイキャッチとサムネイルの違いについて、私なりに整理して書いてみました。しかし調べていると権威ありそうなブログでも「サムネイル」のことを「アイキャッチ」と混ぜて記述している場合が見つかります。
もしかすると私の認識違いの可能性もありますので、その場合は指摘していただけるとうれしいです。
生成したサムネイルを利用した例についての記事もあります。興味ある方は読んでみてください。
ゆめぴょんでした。ちゃおっ！
