ネットと副業

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

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

投稿日:

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

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

 

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

 

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

 

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

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

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

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

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

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

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

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

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

 

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

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

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

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

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

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

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

-

執筆者:

関連記事

no image

Photoshopの書き出しの違いで画像の質を比較

Photoshopにて、ホームページに使う画像をつくるとき、ずーーーーっとWeb用に保存を使って作成しておりました。 Adobe Creative Cloudになってから、Web用保存が多様化しており …

no image

《iPhone買い替え》その2 〜事前準備 データをiCloudにバックアップをする〜

前書き↓ 「iPhone買い換えようかな」と思ったら、とにもかくにもiCloudです。iCloudにバックアップです。せっかくタダでハードディスク領域もらってるので、使えるものはつかいましょう。 その …

no image

《無料で超簡単!》Lineカメラで自撮り画像が、簡単に若返り修正できる

Lineカメラ恐るべしです。 自画撮り写真の肌をキレイにしたり目を大きくしたりできるアプリが、多数でまわっていますが、トークアプリでおなじみ「Line」のカメラアプリ、「Lineカメラ」でも簡単に顔写 …

no image

噂iPhone5seに買い替えようかなと思うのでスペックを比較してみました。

Appleの次回イベント日が2016年3月15日に確定したようですね。 Apple、3月15日〔日本時間16日〕にイベントを開催―iPad、小型iPhoneなど発表予定 | TechCrunch Ja …

『億男』観て号泣してしまいました

億男見てきました。感動しました。 友人に「億男」になるなら見てこいとすすめられて観てきましたので、感じたことをまとめておきたいと思います。なるべくネタバレのないようにしますが、ネタバレが気になる方は読 …