アイキャッチ画像を設定

THE THOR(ザ・トール)のアイキャッチ画像の設定方法を解説するよ!

ゆず

アイキャッチ画像ってメディアの追加とは違うの?

まずは、記事にアイキャッチ画像を設置する方法を説明します。

アイキャッチ画像は投稿・固定ページの編集画面から設置することができます。

ダッシュボード「投稿」または「固定ページ」の「新規追加」や「編集」を選んで、編集画面を開きましょう。

ビジュアルエディタでもテキストエディタでも構いません。

下にスクロールすると右側にアイキャッチ画像を設定する項目がありますので赤枠の箇所をクリックします。

するとメディアライブラリが開きますので、アイキャッチに設定したい画像を選んで、右下にある「アイキャッチ画像を設定」ボタンをクリックして完了です。

画像を選んで設定

または「ファイルをアップロード」してアイキャッチ画像を設定します。

ファイルをアップロードして設定

 

THE THOR(ザ・トール)のアイキャッチ画像関連の設定方法

次はアイキャッチ画像関連の設定方法を説明します。

ダッシュボード「外観」⇒「カスタマイズ」からカスタマイザーを開きましょう。

「基本設定[THE]」から「アイキャッチ画像の設定」を開きます。

アイキャッチ画像設定画面

NO IMAGE画像の設定

デフォルトでは「NO IMAGE画像」は設定されていません。

デフォルトノーイメージ画像

1記事ごとにアイキャッチ画像を設置していれば問題ないのですが、100記事200記事と記事数が増えてきたら、全部が全部にアイキャッチ画像を設置することが難しくなってくるかもしれません。

必須ではないし、急いで設定するようなものではないのですが、もし気が向いたら何か画像を設定しておいても良いでしょう。

アイキャッチホバーエフェクトの設定

この設定は、アイキャッチ画像にマウスオーバー(カーソルを重ねた時)のエフェクト効果を設定します。

アイキャッチホバー時のエフェクトを選択

ズーム(default)マウスオーバー時に画像が拡大表示
ズームグレイ通常時は薄いグレイでマスクされた画像で、マウスオーバーでマスク解除&画像拡大表示
ズームセピア通常時はセピア調の色彩でマスクされた画像で、マウスオーバーでマスク解除&画像拡大表示
ズーム回転マウスオーバー時に画像が右斜めに回転しながら拡大表示
マスクマウスオーバー時に画像が設定されたカラーでマスクがかかる
マスクズームマウスオーバー時に画像が設定されたカラーでマスク&画像拡大表示
マスクズーム回転マウスオーバー時に画像が右斜めに回転しながら拡大表示&設定されたカラーでマスク

マスク系エフェクト利用時のマスクカラーを指定

マスク系のエフェクトのカラーを設定します。

デフォルトでは設定されていませんが、マウスオーバーすると画像が少し暗く表示されます。

マスク系エフェクト利用時のマスク上テキストを入力

アイキャッチ画像にマウスオーバーした際に表示されるテキストを入力します。

デフォルトは「READ MORE」日本語にすると「もっと読む」でしょうかね。

アイキャッチサイズの設定

アイキャッチサイズの設定を行います。

ウィジェット内表示時およびアーカイブでの表示サイズは「デフォルト768×432」「ミニ375×375」「サムネイル150×150」「ミディアム300×300」「ラージ1024×1024」「フルサイズ」の6種類から選択します。

アイキャッチサイズの設定

このサイズとは、画面に表示される見た目の大きさのことではなく、解像度のことのようです。
数値が大きいサイズでは高画質、数値が小さければ低画質になります。

THE THOR(ザ・トール)のアイキャッチ画像の推奨サイズは?

THE THOR(ザ・トール)においてのアイキャッチに利用される画像は「記事一覧ページ」「アーカイブページ」「ウィジェット内での表示(最新記事など)」「投稿ページ」等で使用されます。

投稿ページでのトップに表示される場合でも、ぼやけない程度のサイズにした方が良いでしょう。

サポートフォーラムでは、推奨値を1200px以上としているようです。

私の場合は、ざっくりと800~1300くらいでいいや~って感じで画像アップしています。

多少の画像の粗さは気にしないでいいと思いますよ。

メルマガ登録バナー1

アイキャッチ画像を設定
最新情報をチェックしよう!