アイキャッチ画像は、そのブログ記事を表すサムネイル画像です。はてなブログのトップページのほか、X(旧Twitter)やFacebookなどのソーシャルメディアで表示されます(ページ後半の「アイキャッチ画像の利用シーン」も参照)。
スマートフォンやタブレットから操作される場合には、利用されているブラウザの設定から、PC版(デスクトップ用サイト)表示に切り替えてご利用いただく必要があります。 切り替え方法はスマートフォンやタブレットからPC版のはてなブログを利用するにはをご参照ください。
- アイキャッチ画像を選ぶ
- デフォルトのアイキャッチ画像
- 任意の画像をアイキャッチ画像に指定する
- 自動生成シェア画像について
- シェア画像に表示される内容
- アイキャッチ画像の利用シーン
- アイキャッチ画像がソーシャルメディア上で反映されない場合は
- 関連項目
アイキャッチ画像を選ぶ
アイキャッチ画像には、自動生成シェア画像と記事中にある画像が選択できます。
何も設定していない場合は、記事中にある最初の画像が自動で設定されます。
記事中の2番目以降の画像などを設定したい場合は、記事を投稿する際に編集サイドバーの タブから個別に設定することもできます(このあとの「任意の画像をアイキャッチ画像に指定する」をご参照ください)。
なお、ブログの公開設定が「すべての人に公開」で、アイキャッチ画像が設定されていない場合、ブログタイトル・記事タイトル・記事のカテゴリーから画像(自動生成シェア画像)を自動で生成します(このあとの「自動生成シェア画像について」をご参照ください)。
デフォルトのアイキャッチ画像
ブログのトップページなど記事以外のページには、デフォルトのアイキャッチ画像が自動で使用されます。はてなブログ全体のデフォルトアイキャッチは、次の画像です。
ブログごとにデフォルトのアイキャッチ画像を設定する
デフォルトのアイキャッチ画像は、ブログごとに専用の画像を指定することもできます。
詳細設定 画面の「アイキャッチ画像」で設定してください。
記事中に画像がない場合に自動で設定されるアイキャッチ画像について
記事中に画像がない場合、ブログタイトル・記事タイトル・記事のカテゴリーなどから生成する「自動生成シェア画像」が自動で指定されます。
自動生成シェア画像の指定を無効とし、デフォルトアイキャッチ画像が自動で指定されるよう設定できます。無効にする場合は、詳細設定ページから変更してください。
サムネイルの表示について
アイキャッチに設定した画像は、はてなブログのトップページや記事一覧ページ(/archive
)、各種記事モジュールのブログカードなどでサムネイルとして表示されます。ただし、記事中に画像がない場合に自動で設定されるアイキャッチ画像は、X(旧Twitter)やFacebookなどのソーシャルメディアでのみ表示され、サムネイルとしては表示されません。
また、詳細設定のアイキャッチ画像設定の「アイキャッチのない記事で、この画像を記事サムネイルとして表示する」を有効にした場合には、アイキャッチ画像が指定されていない場合も、デフォルトのアイキャッチ画像をサムネイルとして表示することが可能です。ページのレイアウトのために常にサムネイルが存在する状態にしたい場合など、ご希望に応じてご利用ください。
アイキャッチ画像のサイズに関する注意点
デフォルトのアイキャッチ画像をブログごとに設定する際には、ソーシャルメディアに投稿されることを考慮して、横長で十分な大きさの画像を用意するとよいでしょう。
任意の画像をアイキャッチ画像に指定する
記事中の2番目以降の画像や、あるいは記事中の画像に関係なくデフォルト画像を使いたい、記事中の画像ではなく自動生成シェア画像を使いたいなどの場合には、個別に画像を指定できます。
編集サイドバーの「編集オプション」から次の手順で個別に画像を指定します。
- 編集サイドバーの タブをクリックする
- アイキャッチ画像 という見出しの下に、記事中にあるすべての画像と、デフォルトのアイキャッチ画像が一覧表示される
- 一覧から、アイキャッチ画像に指定する画像をクリックして選択する。あるいは、「自動生成シェア画像を設定する」にチェックを入れる
- 「公開する」または「更新する」をクリックする
また、使用したい画像のURLを「画像URLで指定する」と書かれた欄に直接入力することもできます。
自動生成シェア画像について
ブログの公開設定が「すべての人に公開」で、アイキャッチ画像の設定がない記事をX(旧Twitter)やFacebookなどのソーシャルメディアでシェアする際に、ブログタイトル・記事タイトル・記事のカテゴリーなどから画像を自動で生成します。この画像を「自動生成シェア画像」と呼びます。
ブログの公開範囲について
公開範囲が「すべての人に公開」のブログで、アイキャッチ画像の設定がない記事をソーシャルメディアでシェアした場合に、シェア画像を自動で生成します。
公開範囲を限定したブログの記事をシェアした場合は、画像は表示されません。
シェア画像に表示される内容
シェア画像には、以下の内容を掲載します。画像に掲載される文字の分量は、それぞれの長さによって変わります。
- ブログタイトル
- 記事タイトル
- 記事のカテゴリー
アイキャッチ画像の利用シーン
アイキャッチに指定した画像は、主に次の場面でサムネイルとして表示されます。
はてなブログ内で
- ブログの記事一覧ページ(検索結果、iPhoneアプリなども)
- ブログのサイドバーに表示できる「最新記事」「人気記事」などのモジュール
- はてなブログのトップページなどに掲載されたとき
ソーシャルシェアで
- FacebookやX(旧Twitter)で記事がシェアされたときのプレビュー
- そのほかOGP(Open Graph Protocol)に対応した各ソーシャルメディア
アイキャッチ画像がソーシャルメディア上で反映されない場合は
はてなブログの設定でアイキャッチ画像を変更した後も、FacebookやX(旧Twitter)などのサービスで、古い画像が表示され続けることがあります。
各サービスで表示される画像を更新するには、サービスごとの開発者向けツールを利用してください。最新の記事内容が反映されます。
- シェアデバッガー - Facebook for Developers
- 記事URLを入力し、「もう一度スクレイピング」をクリックしてください。
- Card Validator | Twitter Developers
- 記事URLを入力し、「Preview card」をクリックしてください。
関連項目
- アイキャッチを作る機能
- 記事を書く
- 編集サイドバーを利用して記事を書く
- 編集オプションで予約投稿などを実行する
- 記事の公開と更新、下書き保存
- はてなブログの記事編集画面
- 入力補助ツールバー
- はてなブログの管理画面
- ブログの詳細設定画面
- 外部サービス連携
関連記事
- 2019-09-11 アイキャッチ画像がない記事をシェアした際、ブログタイトルや本文などから画像を自動生成するようにしました
- 2014-11-10 記事を投稿した後のソーシャルメディア通知機能で、記事中の画像を付けてツイートするようにしました
- 2014-02-26 デフォルトのアイキャッチ画像をブログごとに設定できるようにしました
- 2013-01-09 「アイキャッチ画像」機能を追加しました