ネットと副業

副業が本業の収入を大きく超えたので会社やめました

記事一覧に表示されるアイキャッチ画像を設定する

投稿日:

ここまで、なんやかんやとこのサイトに記事を投稿してきました。

テーマをWordPressデフォルトのTwentySeventeenからStingerに変更してからというもの、記事一覧にNO IMAGEという謎の画像が表示されるようになってしまいました…

 

サイドバーの記事一覧にも…NO IMAGE…

 

これは、記事の投稿画面でアイキャッチというものを設定すると画像が表示されます。NO IMAGEのままではなんともみっともないので、早速設定してみましょう!!

 

投稿画面からアイキャッチ画像を設定する

過去に投稿した記事にアイキャッチを設定してみましょう。
投稿画面の右下の方にあります。

アイキャッチ画像を設定をクリックするとアップロードした画像一覧が登場。
とにもかくにも、なにかしら画像を選択して設定してみましょう。

画像を選んでアイキャッチ画像を設定します。

投稿画面ではこうなります。

変更したいときはアイキャッチ画像を削除をして、画像を設定しなおします。

これでOKであれば記事を更新しましょう。

一覧に画像が表示されます!!

アイキャッチ、アイ-キャッチ(目、つかまえる)というくらいですから、読者の目を引くわかりやすい画像で、記事の内容にあった画像にするといい感じですね。

 

アイキャッチ画像のサイズについて

WordPressのダッシュボードから設定>メディアを開いてみましょう。

WordPress上の画像のサイズ設定一覧がでます。

このサムネイルのサイズという部分が、アイキャッチの画像サイズになります。現在は幅150px高さ150pxです。正方形になってますね。

記事の投稿画面でアイキャッチに画像を設定すると、アイキャッチ用に画像をこのサイズにトリミングして作成してくれます。
トリミング、つまり、画像を切り取って正方形にします。

もともと画像が正方形でできていれば、そのまま縮小されますが、画像が長方形の場合は縦横の長い方が切り取られてしまいます。

今回は、記事の中で使用した画像を選びましたが、アイキャッチ用に画像をつくっても見た目のクオリティがアップしてよいですね!

-

執筆者:

関連記事

no image

Dreamweaverのブラウザプレビューをショートカットキーを好きなキーを割り当てて変更する

Dreamweaverユーザーあるあるです。       設定を初期化してしまいました。 コーディングしてる時はかなり集中してることが多いです。ガガーッとコーディングして、「よっしゃブラウザで確認だ」 …

no image

《iPhone買い替え》その4 〜事前準備 ゲームアプリのバックアップGameCenter〜

iPhone買い換え前の事前準備だけで、疲れてきました(;´Д⊂)フゥ〜 ゲームアプリをバックアップします。 ゲームについては、わたくし、無課金ライトユーザーなのですが、BoomBeachだけずっとや …

no image

Googleの新サービスアプリInboxダウンロードしてみたら使えんかった

  普段、Macbookもって、iPadもって、iPhoneつかって、会社ではiMacでて、すっかりapple信者みたいに思われがちですが、どちらかというとappleよりGoogle先生を崇拝していま …

no image

《Mac OSX》他人に見られたくない、恥ずかしい予測変換を削除!

  会社のオフィスで、一瞬ヒヤリとしました。幸い誰にも見られず… 自分のMacBookを会社に毎日持っていってます。会社に会社用のiMacあるから、MacBookを持っていかなくてもいいっ …

組織のトップに立って動かしていくということ

人気漫画ワンピースの主人公、モンキー・D・ルフィー。 ルフィーは「海賊王になる」という夢をもって一人大海原に飛び出しました。 どんどん仲間を増やし、いまや海軍や世界中の海賊が注目する一大勢力になってい …