アイキャッチ画像は記事一覧やSNS共有で記事を表す画像です。投稿編集画面で設定し、公開ページだけでなくTOPやカテゴリー一覧でも見え方を確認します。

アイキャッチ画像の設定

投稿編集画面の設定サイドバーを開き、「アイキャッチ画像を設定」を選びます。メディアライブラリから画像を選ぶか、新しい画像をアップロードします。

画像の選び方

記事内容と一致し、一覧の小さな表示でも意味が伝わる画像を選びます。文字を詰め込みすぎず、サイト内で縦横比を揃えると一覧が整います。

ミカ
ミカ

「画像の選び方」まで進めたら、最初より画面の意味が分かってきました。
でも、保存した後にどこを見れば成功なのか、まだ少し心配です。

佐藤さん
佐藤さん

その不安は自然だよ。
設定画面の保存表示だけで終わらせず、公開側で変化を一つ確認すれば判断しやすい。

ミカ
ミカ

一度に全部を確認しなくていいんですね。
今回変えた場所だけ見るなら、私も見落とさずに進められそうです。

佐藤さん
佐藤さん

そう。
変えた項目と確認する画面を一組にして進めれば、原因が分からなくなるのを防げるよ。

代替テキストを確認

装飾だけでなく内容を伝える画像なら、何が写っているかを簡潔に入力します。記事タイトルをそのまま重ねて入力する必要はありません。

表示されない時

更新ボタンを押したか、テーマがアイキャッチ表示に対応しているか、画像URLが読み込めるかを確認します。TOP、カテゴリー、記事ページの3か所を見ます。

最後に確認すること

  • 変更前に、何を直す操作かを確認した
  • 保存または更新が完了したことを確認した
  • 公開画面をPCとスマートフォンで開いた
  • 分からない項目を推測だけで変更していない

一度で完璧に覚える必要はありません。この記事の順番どおりに一項目ずつ操作し、結果を確認してから次へ進めば、初心者でも安全に設定できます。

結論:投稿設定の「アイキャッチ画像」から1枚を指定する

アイキャッチ画像は、記事本文へ挿入する画像とは別に、記事を代表する1枚として設定します。投稿一覧、トップページ、関連記事、SNS共有などで使われますが、どこへ表示されるかと切り抜き方はテーマによって異なります。

本文画像との違い

比較 アイキャッチ画像 本文画像
設定場所 投稿設定サイドバー 本文内の画像ブロック
主な役割 記事の代表画像 手順や内容の説明
一覧表示 テーマが自動表示する場合がある 通常は本文を開いた時に表示
代替テキスト 画像内容に応じて設定 本文での役割に応じて設定

本文の先頭へ画像を置いただけでは、アイキャッチとして認識されないテーマがあります。逆に、テーマが記事上部へアイキャッチを自動表示する場合、同じ画像を本文先頭にも入れると二重表示になります。

アイキャッチ画像を設定する手順

  1. 「投稿」→「投稿一覧」から記事を開きます。
  2. 右上の設定アイコンを押し、「投稿」タブを表示します。
  3. 「アイキャッチ画像」を開きます。
  4. 「アイキャッチ画像を設定」を押します。
  5. 既存画像を選ぶか、「ファイルをアップロード」から追加します。
  6. 画像を選択し、代替テキストなど必要な情報を確認します。
  7. 「アイキャッチ画像を設定」を押します。
  8. サイドバーに画像のプレビューが出たことを確認します。
  9. 「更新」または「公開」を押します。

保存前にブラウザを閉じると設定が反映されません。サイドバーへ画像が出ただけで終わらず、更新完了の表示まで確認します。

画像サイズはテーマの推奨値を優先する

WordPress全体で一つの絶対的な推奨サイズはありません。テーマが一覧カードを16:9で表示するなら、1200×675pxのような同じ比率でそろえると切り抜きが安定します。正方形カードを使うテーマなら、正方形向けの画像が必要です。

  • 利用テーマの公式マニュアルで推奨寸法・比率を確認する
  • 同じサイトでは基本の比率をそろえる
  • 重要な文字や顔を画像の端へ置かない
  • スマートフォンで小さくなっても内容が分かる構図にする
  • ファイル容量を必要以上に大きくしない

一覧で中央部分が切り抜かれることを想定し、重要な要素は中央寄りに置きます。文字を大量に入れた画像は、小さいカードで読めなくなるため避けます。

設定したのに記事上部へ表示されない場合

最初に、投稿編集画面のサイドバーへアイキャッチ画像が残っているか確認します。残っているなら保存はできています。その後、表示場所ごとに切り分けます。

症状 確認場所 対処
記事ページだけ出ない テーマの投稿表示設定 アイキャッチ表示のオン・オフを確認
トップ一覧だけ出ない トップページのカード設定 サムネイル表示と対象投稿タイプを確認
一部記事だけ出ない 各投稿のサイドバー 画像を設定して更新
古い画像が出る キャッシュ・SNSキャッシュ サイトキャッシュを削除し、SNSは再取得
画像がぼやける 元画像寸法 表示枠より小さい画像を避ける
変な位置で切れる テーマの比率・トリミング 重要部分を中央へ置いた画像に変更

テーマ変更後に画像が崩れた時

テーマを変更すると、一覧カードの縦横比や生成されるサムネイルサイズが変わることがあります。新しいテーマの推奨比率を確認し、代表的な記事をPCとスマートフォンで見ます。

  1. トップページ、カテゴリー、関連記事のカードを確認します。
  2. 画像の切り抜き、ぼやけ、縦横の伸びを確認します。
  3. 元画像が小さすぎないかメディアライブラリで確認します。
  4. 新しい画像サイズが必要な場合は、テーマ公式の再生成手順を確認します。
  5. 一括処理の前に一記事で結果を確認します。

既存画像を無条件で全削除・再アップロードする必要はありません。元画像を残したまま新しいサムネイルを生成できる場合があります。

SNSで別の画像が表示される場合

SNS共有画像は、SEO機能のOG画像設定がアイキャッチより優先される場合があります。記事の公開画面でアイキャッチが正しくても、SNSだけ古い画像なら次を確認します。

  • 記事ごとのSNS画像が個別設定されていないか
  • サイト全体の既定OG画像が優先されていないか
  • 共有先が古い情報をキャッシュしていないか
  • 公開HTMLのOG画像URLが新しい画像か

WordPressのアイキャッチを何度設定し直しても、SNS側のキャッシュが残っていれば表示は変わりません。公開HTMLの画像URLと共有先の再取得を分けて確認します。

公開後の確認手順

  1. 記事ページを開き、テーマが表示する位置を確認します。
  2. トップページの記事カードを確認します。
  3. 対象カテゴリーの一覧を確認します。
  4. 関連記事に同じ記事が出る場合はカード画像を確認します。
  5. スマートフォンで文字切れと横スクロールがないか確認します。
  6. SNS共有を使う場合はOG画像も確認します。

設定完了の目印は、投稿編集画面に画像が保存され、テーマが想定する各一覧で同じ記事の代表画像が崩れず表示されることです。

よくある質問

本文の最初の画像が自動で使われますか?

テーマによります。確実に指定したい場合は、投稿ごとにアイキャッチ画像を設定してください。

推奨サイズは何pxですか?

テーマの表示枠によります。まず既存記事の比率を確認し、同じ比率で揃えるのが安全です。