こんなお悩みを解決します。
✔︎本記事の内容
・アイキャッチの画像関連の設定方法
・アイキャッチの推奨画像サイズ
今回は、THE THORのアイキャッチについて解説します。
アイキャッチを使うと、ブログの記事を目立たせる効果があります。
本記事では、アイキャッチの設定方法・アイキャッチの画像関連の設定方法・アイキャッチの推奨画像サイズの3つのステップで「THE THORのアイキャッチの設定方法と推奨画像サイズ」について解説してきます。
目次
THE THORのアイキャッチの設置方法
THE THORのアイキャッチ画像は、投稿・固定ページの編集画面から設置することができます。
ダッシュボード→投稿または固定ページ→記事の新規追加もしくは編集→表示画面右側のアイキャッチ
メディアライブラリが開きます。
新しく画像をアップロードするときは、「ファイルをアップロード」でアイキャッチ画像をアップロードします。
アップロードすると、「メディアライブラリ」にアップロードした画像が登録されます。
画像を選択して、右下の「アイキャッチ画像を設定」をクリックするとアイキャッチを設置することができます。
THE THORのアイキャッチの画像関連の設定方法
THE THORのアイキャッチ画像では、3つの設定がすることができます。
- NO IMAGE画像の設定
- アイキャッチホバーエフェクトの設定
- アイキャッチサイズの設定
アイキャッチ画像の設定は以下の場所にあります。
ダッシュボード→外観→カスタマイズ→基本設定[THE]→アイキャッチ画像の設定
NO IMAGE画像の設定
NO IMAGE画像の設定では、アイキャッチ画像未設定時に表示させる画像を登録しておくことができます。
NO IMAGE画像を設定しておくと、未設定時の「No Image」という表示がなくなります。
100記事200記事と、記事数が増えていくと、毎回アイキャッチ画像を設定するのが難しくなってくるかもしれません。
「No Image」と表示されると見栄えがよくないので、あらかじめ設定しておくのが良いでしょう。
アイキャッチホバーエフェクトの設定
アイキャッチホバーエフェクトでは、3つの設定ができます。
- エフェクト
- マスクカラー
- マスク上のテキスト
3つについて解説していきますね。
アイキャッチホバー時のエフェクト
アイキャッチ画像にマウスのカーソルを重ねたときのエフェクト効果を設定できます。
| ズーム(デフォルト) | マウス重ねた時に画像を拡大表示 |
| ズームグレイ | 通常は薄いグレーでアイキャッチ画像がマスクされ、マウス重ねた時にマスク解除と画像を拡大表示 |
| ズームセピア | 通常はセピア色でアイキャッチ画像がマスクされ、マウス重ねた時にマスク解除と画像を拡大表示 |
| ズーム回転 | マウス重ねた時に画像が右斜めに回転しつつ拡大表示 |
| マスク | マウス重ねた時にマスクカラーで指定した色で画像がマスクされる |
| マスクズーム | マウス重ねた時にマスクカラーで指定した色でマスクと拡大表示 |
| マスクズーム回転 | マウス重ねた時に画像が右斜めに回転しつつ拡大表示とマスクカラーで指定した色でマスク |
| 無し | エフェクト無し |
マスク系エフェクト利用時のマスクカラー
「マスク系エフェクト利用時のマスクカラー」は、アイキャッチ画像をマスクしたときの、マスクカラーを設定できます。
※マスクとは画像の上に薄い膜のようなカラーをつけることです。
例）青色のマスクを設定したとき
初期状態
アイキャッチ画像の上にマウスのカーソルを持っていくと
マスク系エフェクト利用時のマスク上のテキスト
「マスク系エフェクト利用時のマスク上のテキスト」は、アイキャッチ画像にマウスを重ねたときに表示さえるテキストです。
ブログは日本人が読むことが多いので、「さらに読む」などと日本語で設定するのがおすすめです。
アイキャッチサイズの設定
アイキャッチサイズは、6種類の設定ができます。
| サイズ | 解像度 |
| アイキャッチ(デフォルト) | 768×432 |
| アイキャッチミニ | 375×375 |
| サムネイル | 150×150 |
| ミディアム | 300×300 |
| ラージ | 1024×1024 |
| フル | - |
ここの設定は、見た目の大きさではなく解像度の設定になります。
・解像度の数値が小さい：低画質
解像度をよくすると高画質になりますが、ページ読み込みが遅くなる原因にもなるため、デフォルトもしくはアイキャッチミニをおすすめします。
THE THORのアイキャッチの推奨の画像サイズ
THE THORのアイキャッチ画像の推奨サイズは、「768×432px」です。
公式では推奨値を1200px以上としています。
しかし、大きくするとデータが重くなるため、ページ読み込みが遅くなることに繋がります。
そのため、私はデフォルトのアイキャッチ画像のサイズの「768×432」で設定しています。
THE THORのアイキャッチ画像の設定方法と推奨画像サイズまとめ
THE THORのアイキャッチ画像の設定方法と推奨画像サイズについて解説してきました。
再度、設定方法とサイズについてまとめていきますね。
・アイキャッチ画像の設定方法
ダッシュボード→外観→カスタマイズ→基本設定[THE]→アイキャッチ画像の設定
・アイキャッチの推奨画像サイズ
768×432px
アイキャッチ画像を使うと、記事を目立たさせる効果があります。
それにより、クリック率が向上しサイト滞在時間長くなるため、SEO的にも良い効果が生まれます。
ぜひ、アイキャッチを効果的に設定して、サイトをパワーアップさせましょう。
初心者だからこそWordPressテーマを使うべき理由
無料テーマでこんなことに苦戦していませんか
- 思ったようにデザインできない
- カスタマイズに時間がかかる
- アクセス数が増えない
- 稼ぐことができない
稼げるブログを作るには、検索の上位に表示されなければなりません。
そのためには、思い切って初期投資することが大事です。
WordPressの有料テーマでできること
- 検索上位を目指しやすくなる
- 見た目が綺麗で読みやすくなる
- オリジナル性が出る
- SEO対策がばっちり
- 有名ブロガーも使用している
月に7桁、8桁も稼いでいる有名ブロガーさんは、有料テーマを使用しています。
なぜなら、SEO対策ができている読者が読みやすいブログ作りができるから。
ブログで稼ぐには、いかに読者の方に寄り添ったブログ作りができているかが重要です。
読者が読みやすい→PV増加→収益増加
このような好循環がうまれます。
だからこそ、稼いでいるブロガーさんほど、初期投資をして有料テーマを使っています。
