WordPress

WING(AFFINGER5)でアイキャッチ画像を設定する方法

2020年12月29日

WING(AFFINGER5)でアイキャッチ画像を設定する方法

悩む人
アフィンガー5を使い始めましたが,アイキャッチ画像が表示されません。
その悩み解決します。
ヒロシ

WordPressテーマWING(AFFINGER5)でアイキャッチ画像を設定する方法を解説していきます。

この記事はこんな方におすすめ

  • AFFINGER5でアイキャッチ画像の設定方法が分からない
  • アイキャッチ画像の表示位置を変更したい

また,

  • WordPressブログでアイキャッチ画像のおすすめのサイズが知りたい
  • affinger5でサムネイルを綺麗に表示させたい
  • 綺麗なデザインのアイキャッチを作りたい

という人は,以下の記事でアイキャッチ画像のおすすめのサイズやサムネイルを編集する方法について詳しく解説していますので,参考にしてください。

アフィンガー5でできるデザイン変更やカスタマイズについては,以下の記事で詳しく解説しています。

参考

「WING(AFFINGER5)」は,SEOに強く収益が発生しやすいと評価されていて,稼ぐことに特化した人気のあるWordPress有料テーマです。

WING(AFFINGER5)に興味のある人は,以下の記事で紹介していますので,参考にしてください。

WING(AFFINGER5)【メリットとデメリットは?】購入とインストールの手順

参考記事
WING(AFFINGER5)【メリットとデメリットは?】購入とインストールの手順

続きを見る

それでは,アフィンガー5でアイキャッチ画像を設定して綺麗に設置する方法を解説していきます。

AFFINGER5でアイキャッチ画像を設置する手順

記事の投稿画面で,画面右側のほうにある「アイキャッチ画像」の項目で「アイキャッチ画像を設定」をクリックします。

「ファイルをアップロード」で新規ファイルをアップロードする又は「メディアライブラリ」から画像を選択します。

ここでは,メディアライブラリから画像を選択する方法を紹介します。

  1. 「メディアライブラリ」を選択
  2. アイキャッチ画像にする画像をクリック
  3. 「アイキャッチ画像を設定」をクリック

「アイキャッチ関連」の項目で「設定に関わらずアイキャッチ挿入」にチェックを入れます。

ここにチェックを入れないとアイキャッチ画像が表示されません。

これで記事にアイキャッチ画像を設置する事ができます。

プレビューで確認しますと

記事のページの1番上にアイキャッチ画像が表示されています。

  • アイキャッチ画像にサイトURLを表示させる場合,「写真クレジットにサイトURLを使用」にチェックを入れます。
  • アイキャッチ画像に任意のテキストを表示させる場合,任意のテキストに文字を入力します。

以上がアフィンガー5でアイキャッチ画像を設置する手順です。

すべての投稿にアイキャッチ画像を表示させる

AFFINGER5のデフォルトの状態ですと,先に解説した記事の投稿画面のアイキャッチ関連の項目で「設定に関わらずアイキャッチ挿入」にチェックを入れないと,アイキャッチ画像が表示されません。

毎回記事を作成するたびにこの項目にチェックを入れる必要がありますので,うっかり忘れてしまってアイキャッチ画像が表示されないというケースもありえます。

そんな時に便利なのが,記事を作成するたびに「設定に関わらずアイキャッチ挿入」にチェックを入れなくても,アイキャッチ画像の表示ができる設定になります。

管理画面から「AFFINGER5管理」をクリックします。

「投稿・固定記事」をクリックします。

アイキャッチ設定の項目で「アイキャッチ画像の表示をすべての記事で有効化する(デフォルトは上部)」にチェックを入れます。

「SAVE」をクリックします。

これで記事を作成するたびに「設定に関わらずアイキャッチ挿入」にチェックを入れていなくても,アイキャッチ画像の表示ができるようになります。

タイトル上にあるアイキャッチ画像の位置を変更する

AFFINGER5のアイキャッチ画像はデフォルトの設定ですとタイトルの上に配置されます。

WordPressの他のテーマや他のサイトを見てみてもアイキャッチはタイトルの下に配置されているケースが多いです。

このアイキャッチの位置をタイトル下に変更する事が可能です。

「AFFINGER5管理」→「投稿・固定記事」→アイキャッチ設定の項目で「アイキャッチ画像をタイトル下表示に変更する」にチェックを入れます。

ここでも「SAVE」を忘れずにクリックしましょう。

記事のページで確認すると,タイトルの下にアイキャッチ画像が配置されています。

サムネイルの表示を編集する

affinger5はデフォルトですと記事一覧のサムネイルが正方形になっていて,サムネイルに表示されるのは中央の部分のみで,画像にタイトルや見出しを入れている場合に左右が見切れてしまい、うまく文字や画像が表示されないケースがあります。

このサムネイルのテキストを画像の中心に綺麗に配置する為には,無料のグラフィックデザインツール「Canva」を使います。

もちろん,Canva以外の画像編集ツールでも可能です。

「Canva」を使ってサムネイルのテキストを綺麗に中央に表示させる方法は次の記事で紹介していますので,参考にしてください。

また,アイキャッチ画像のおすすめのサイズについても解説しています。

まとめ

以上になります。

今回の記事をまとめると,

  1. AFFINGER5でアイキャッチ画像を設置する手順
  2. すべての投稿にアイキャッチ画像を表示させる
  3. タイトル上にあるアイキャッチ画像の位置を変更する
  4. サムネイルの表示を編集する

になります。

それではまた!

  • この記事を書いた人
  • 最新記事

ヒロシ

ヒロシです。
現在は会社員としてエンジニアの業務を行っています。
担当業務は主に、WordPressサイト開発、改修です。
ブログやプログラミング学習で役に立つ情報を発信しています。

-WordPress

Copyright © ヒロシブログ 2020