WordPressアイキャッチ画像とは・アイキャッチの設定方法

本記事では、WordPressのアイキャッチ画像について説明していきます。

読者の方に記事を読んでもらうための大事な要素の一つで、世間一般で言う「サムネイル画像」の役割を果たします(※)。

(※)WordPressでは、世間一般でいう「サムネイル画像」とは異なる意味で、150px*150pxの小さい画像と「サムネイル」を言う用語で用いています。WordPressにおいてはアイキャッチ画像と、150px*150pxのサムネイルは別物ですので注意しましょう。

ご自身でブログ運営などをしている方は是非お役立てください。

この記事でわかること

WordPressのアイキャッチ画像について
WordPressのアイキャッチ画像の設定方法
アイキャッチ画像を作成する際に利用したいツール・フリー素材サイト

WordPressのアイキャッチ画像とは

アイキャッチ画像とは、Eye(読者の目)をCatch(惹きつける)させるための画像のことで、世間一般でいう「サムネイル画像」のことです。

WordPressにおいては、ブログ記事一覧のサムネイルとしてアイキャッチ画像が使われたり、TwitterやFacebookなどのSNSでシェアしたときのサムネイル画像として使われます。

(※)WordPressでは、世間一般でいう「サムネイル画像」とは異なる意味で、150px150pxの小さい画像と「サムネイル」を言う用語で用いています。
WordPressにおいてはアイキャッチ画像と、画像サイズ150px150pxのサムネイルは別物ですので、混同しないように注意しましょう

下記の画像は、当サイト（WEBST8のブログ）トップページの画面キャプチャになります。

トップページには様々な記事がありますが、各々ユニークなアイキャッチ画像が設定されているため、サイトに訪れた読者の方が今1番欲しい情報がパッと見てわかるようになっています。

アイキャッチを設定することによって、記事をクリックして読まなくても「大体はこんな内容が書かれているんだな」と把握できるため、見た目がいいだけではなく、読者の方にも親切な記事になります。

WordPressのアイキャッチ画像の設定方法

それでは早速、WordPressでアイキャッチを設定する方法を紹介していきます。

アイキャッチ画像の設定方法

投稿または固定ページの編集画面を開きます。右メニューからアイキャッチ画像という項目をクリックします。

旧エディターの場合

旧エディタークラシックエディターを利用の場合は下記の編集画面からアイキャチ画像を設定できます。

アイキャッチ画像として設定したい任意の画像を選択して「アイキャッチ画像を設定」ボタンをクリックします。

ブロックエディターの場合は、上記手順後に、記事を公開することでアイキャッチ画像の表示が確認できます。

設定項目が表示されない場合

アイキャッチ画像が表示されない場合は、表示項目でアイキャッチ画像が非表示になっている場合があります。編集画面右上のオプションをクリックします。

右メニューの設定をクリックします。

パネル＞アイキャッチ画像のチェックが外れていたらチェックを入れておきましょう。

アイキャッチ画像が表示されない場合の多くは、上記の「アイキャッチ画像」が選択されていない時に起こるので、もし表示されなかった場合は今一度チェックしてみましょう。

アイキャッチ画像はSNSでシェアした時のOGP画像に設定される

多くのWordPress環境では、設定したアイキャッチ画像はLINE・Twitter・Facebook等のSNSでシェアした時のOGP画像として設定されます(テーマや設定によっては異なる場合もあります)。

(関連記事)【OGPとは】OGPの基本と使い方や設定方法を解説

「各SNSでシェアされた時のOGP画像表示の確認がしたい」とお考えの方は、簡単にOGP画像表示の確認できる無料サービスラッコツールズを使ってみましょう。

ラッコツールズ（OGP確認）公式サイト：https://rakko.tools/tools/9/

使い方は簡単で、OGP画像表示の確認をしたいサイトのURLを入力するだけで、以下のようにFacebook・Twitter・はてなブックマーク・LINEのOGP画像表示を確認することができます。

SNS OGPシュミレーション — https://rakko.tools/tools/9/

WordPressアイキャッチサイズは何pxで作れば良いか？

アイキャッチ画像のサイズですが、割とテーマやサイトによってばらつきがあり「必ずこのサイズでないといけない」といったものはありません。

ネット上を調べてみると、基本的にSNSにシェアしたときに端が切れにくいと言う理由から、無難なサイズは「横1200px * 縦630px (1.91 : 1)」という意見が多いです。

【2019年5月時点での推奨画像】
一番目立たせたい物が真ん中に配置されている
1200*630（比率 1:0.525）
PNG画像
推奨理由には各SNSでの「画像の表示比率」・SNS側で行われる「画像の圧縮処理」が関係しています。【画像の表示比率】
Facebook：1:0.522
Twitter（large）：PC版 1:0.502、スマホ版 1:0.524
はてなブックマーク：PC版 1:0.68、スマホ版 1:0.75
OGP確認 | ラッコツール

ですので、よくわからないという方はとりあえず「1200px * 630px」でアイキャッチ画像を作っておけば無難でしょう。

ただし、割とテーマやサイトによって、サイズや比率にはバラつきがあります。アスペクト比16:9のサイズ(横幅1200pxの場合は縦675px)がおすすめされているテーマもあります。

JINではアップロードしてもらった画像を、16:9の比率になるよう自動トリミングするようになっています。そのため横幅が760px以上の画像をいれてもらえると綺麗に入ります（縦は自動で切り取られます。）
アイキャッチ画像はどのくらいの大きさが最適？ | JIN MANUAL

ちなみに当サイトでは、横幅1200px * 縦742px　(黄金比 1 : 1.618)でアイキャッチ画像サイズを作成しています。

高解像度端末も考慮して画像の綺麗さと容量のバランスを考慮すれば、横幅1200pxはくらいで、テキストがある場合はある程度画像の中央よりに配置すると、比較的どのSNS・表示方式でも綺麗に写ることが多いのではないかと思います。

アイキャッチ画像の作り方・おすすめツールCanva

画像のサイズ加工・テキストなどの装飾におすすめなのがデザインツール「Canva(キャンバ)」です。

Canvaは、どこにいても、どんなデザインでも作成できるツールです。ドラッグ&ドロップで作成できるツールと、カスタマイズ可能なテンプレートで、世界 179 ヵ国で 10 million (1000万)のユーザーが 400 million (4億)を超えるデザインを作ってきました。現在は 100 を超える言語で提供しており、パソコンやモバイル端末でもご利用いただけます。インターネットさえ繋がれば、誰もがCanvaをご利用いただけます。 Canva公式サイトより引用

アイキャッチ素材はご自身の持つ写真画像のほかに、後述のフリー素材を利用することもできます。

素材サイトの画像をそのまま利用サイズだけ加工してアイキャッチ画像にすることもできますが、当サイト（WEBST8のブログ）のように、画像素材＋テキストを設定したりすることで、よりユニーク・わかりやすいアイキャッチ画像を作成することができます。

Canvaは、Webからできるデザイン作成ツールです。PCやスマホから画像をアップロードして、複数の画像を組み合わせたり、画像をトリミングしたり、文字や図形を入れて画像を加工することができます。

公式サイト：https://www.canva.com/ja_jp/

Canvaは基本的には無料で使えますが、Canva Proという月額1,500円の有料プランもあり、無料プランと比較して利用できる素材やフォントが増えたり、データ容量の拡張などが可能になります。

デザインの知識がない方でも、Canvaで用意されている素材やテンプレートを利用する事で、簡単におしゃれな画像を作成することができ、アイキャッチ画像だけでなく各SNSで投稿する用の画像、バナーやチラシの画像作成まで幅広く使う事ができます。

また、Canvaはツールをインストールする必要がなく、ブラウザ上で利用できるためPCだけでなくスマートフォンからも操作することもできます。

■【Canva】Web上のデザイン作成ツールCanvaの使い方・その１(動画解説版)

イラストレータやフォトショップなど専門向きソフトがなくても、素人でも簡単に始められるサービスなのでありがたいですね。

Canvaの詳しい使い方については「デザイン作成ツール Canva(キャンバ)の使い方」からご確認ください。

フリーで使える素材サイト

ここからは、WordPressのアイキャッチ画像で使えるフリー素材サイトをいくつかご紹介します。

記載のフリー素材サイトの利用規約・ライセンス情報は2021年12月時点のものです。利用する際は改めて、フリー素材サイトの利用規約・ライセンス情報をしっかり確認するようにしましょう。

PIXABAY(ピクサベイ)

PIXABAYは、会員登録不要で利用できる海外の画像素材サイトです。美しくて綺麗な写真が多い一方、日本人モデルや日本系の素材を探すのには不向きです。

ビジュアル重視の美しい素材が多いので壮大・綺麗・神秘的・グローバルなコンテンツに向いています。反面、日本人の日常・ビジネスシーンなどの画像はあまりないので不向きです。

Pixabayとは？ Pixabayは著作権のない画像や動画を共有する、活気のあるクリエイティブコミュニティです。すべてのコンテンツはクリエイティブコモンズCC0の下で公開されています。これにより、たとえ商業目的であっても、許可を求めたりアーティストに信用を与えることなく安全に使用できます。

会員登録	不要
クレジット表記	不要
商用利用	可能

写真AC(Photo AC)

写真ACは、日本の巨大写真素材サイトです。利用には無料の会員登録が必要ですが、人物・風景・パターン画像などなんでも揃っているオススメの日本の画像素材サイトです。

日本人モデルや日本の風景をはじめ色々な素材がある日本のビジネスシーンでも役立つ素材が多いのでホームページやブログの素材として重宝できます。

なお、無料版は制限がいくつかありますので、本格的に使う方は有料のプレミアムプランもおすすめです

写真ACは無料で写真素材をダウンロードOK!、さらに商用利用OK！* 写真ACの写真素材は、フリーダウンロードできます。メールアドレスとパスワードを写真ACへ登録するだけで、すぐに写真素材のダウンロードができます。人物、ビジネス、生き物、花・植物、食べ物・飲み物など、様々な写真素材が無料でダウンロード可能です。商用利用もOKなので、チラシやポスター、WEBサイトなどの広告、ポストカードや年賀状などにもご利用いただけます。クレジット表記や許可も必要ありません。