全体設定

WordPressのアイキャッチ!初心者向けに解説(アイキャッチとは?役割について、表示される場所一覧)

WordPressのアイキャッチを理解しよう!

これからWordPress初心者の人に向けてアイキャッチの説明をします!実は アイキャッチはとても複雑で難しい項目なんです。適当に設定してしまうと失敗する可能性があります。そうならならいためにもきちんと基礎を知っておきましょう。ここではアイキャッチに関して初心者が知っておいたほうがいいことをまとめました。設定を始める前に目を通していってください!

例に用いたテーマはAFFINGER6(アフィンガー6)です。

アイキャッチとは?

アイキャッチとは?アイキャッチ=画像のタイトル

まず「アイキャッチとは何か」から。アイキャッチは一言で言うとこんな感じです。

記事の内容を「一言」で表したものがタイトル。そして記事の内容を「1枚の画像」で表したものがアイキャッチ

つまり アイキャッチは「画像のタイトル」と言い換えることができます。

アイキャッチとは?

  • 記事の内容を「一言でまとめたもの」→タイトル
  • 記事の内容を「一枚の画像でまとめたもの」→アイキャッチ

アイキャッチの役割について

次にアイキャッチの役割について説明します!アイキャッチは何のためにあるのかというと2つの役割があるんですよ。この違いが分かれば設定がとても楽になります。

アイキャッチの役割1:トップ画像の役割

みなさんも誰かのブログでこのように記事の先頭に画像が大きく表示されているのを見たことがあると思います。この大きな画像がアイキャッチです。これはアイキャッチの「記事の始まりを表す使い方」です。トップ画像といったほうがわかりやすいかも。

アイキャッチの役割1:投稿ページにおけるトップ画像の働き

アイキャッチの役割1:記事ページ上部の大きい画像はトップ画の役割

「アイキャッチの働きは?」と聞いて多くの人はこの働きしか思い浮かばないと思います。ですがアイキャッチの働きは他にもあるんですよ。

アイキャッチの役割2:客引き的な役割

ここからが本題!

アイキャッチは記事ページ以外でもいろんな場所で見ることができます。

例えば記事一覧です。記事一覧とは記事を一覧に並べたものですが(記事一覧をちょっと思い浮かべてください)そこにアイキャッチも表示されていると思います。

これは読者に記事の存在をアピールしているんです。ちょうどお店の外でお客さんを探す客引きみたいな感じですね。これがアイキャッチの第2の働きになります。

アイキャッチの役割2:客引き的な役割(記事の外で読者にアピール)

アイキャッチの役割2:サムネイルは客引き的な役割

アイキャッチは記事一覧だけでなくブログカードやスライドショーでも使われます。さらに、アイキャッチはサイト内に留まらずサイトの外でも使われます。

サイトの外でアイキャッチが使われる例が、わかりやすいところでいうとTwitterカードです。みなさんTwitterのタイムラインで記事のリンクがカード状になっているものを見たことはないでしょうか?あれがTwitterカードと呼ばれる機能なんですがそこに使われているのはアイキャッチ画像です。

Twitterカードの例
Twitterカードの例

アイキャッチはいろんなところで使われているんですね。

ミニサイズのアイキャッチを「サムネイル」と呼ぶ

ここでひとつ用語の紹介です。アイキャッチは記事の外では縮小されて(ミニサイズになって)表示されます。この縮小されたアイキャッチのことを「サムネイル」と呼びます。

サムネイルとはアイキャッチを縮小したもの

【サムネイル】=アイキャッチが縮小されたもの

「役割1」と「役割2」を見分ける方法

「役割1」と「役割2」を見分けるポイントはアイキャッチが表示されてる場所です。記事の冒頭に表示されているアイキャッチは「役割1」です。そしてそれ以外で表示されているものは「役割2」です。記事の「内側」か「外側」かで判断してください。

サムネイルが表示される場所の一覧

引き続き「役割2」のお話です。

先ほども軽く説明しましたがサムネイルはいたるところで使われます。どこに表示されるか一覧にしました。これらを把握しておくとあとで設定するときに楽です。軽く目を通しておいてください。

記事一覧

記事一覧です(記事を一覧にして表示したもの)。一番わかりやすいのは新着記事を並べた新着記事一覧ですね。他には関連記事を並べた関連記事一覧とかもあります。

サムネイルが表示される場所(記事一覧)間にあるのはインフィード広告
メインカラムとサイドバーの記事一覧

インフィード広告

記事一覧と深い関わりがあるのがインフィード広告です。インフィード広告とは記事一覧に同化した広告です。記事一覧のサムネイルの形とインフィード広告の画像の形をぴったりにすれば記事と広告の見分けがつかなくなりきれいなレイアウトになります。

ブログカード

ブログカードはリンクをカード状にしたものです。紹介先の記事のサムネイルが表示されます。

サムネイルが表示される場所(ブログカード)

スライドショー

スライドショーは横に動く記事一覧です。

前の記事、後ろの記事

「前の記事、後ろの記事」は投稿ページ(の下部)に表示される前後のページへ行くリンクです。

サムネイルが表示される場所(前の記事、後ろの記事)

ここまではサイトで使われるサムネイルでした。


ここからはサイトので使われるサムネイルです。

Twitterカード

TwitterカードはTwitter上で記事のURLを貼り付けると表示されるカード状のリンクです。

サムネイルが表示される場所(Twitterカード)

facebook

fabebookに記事をシェアすると表示されるカード状のリンクです。

検索結果

検索の結果ページでまれにサムネイルが表示されることがあります。

サムネイルが表示される場所(検索結果)

こんな感じでサムネイルはサイトの内や外を問わずいろんな場所で表示されます。

まとめ

ということでまとめです。

アイキャッチとは?

  • アイキャッチの2つの役割を理解しよう!
    • 役割1:投稿ページのトップ画像の役割
    • 役割2:客引き的な役割(記事の外で読者にアピール)
  • アイキャッチが縮小されたものをサムネイルと呼ぶ

サムネイルが表示される場所

サイト内

  • 記事一覧
    • インフィード広告
  • スライドショー
  • ブログカード
  • 前の記事、次の記事

サイト外

  • Twitterカード
  • facebook
  • 検索サイトの検索結果

-全体設定