WordPress

【ワードプレス】アイキャッチ画像のサイズ(高さ)を揃える方法【プラグインなし】

2019年8月12日

【ワードプレス】アイキャッチ画像のサイズ(高さ)を揃える方法【ツール&プラグインなし】

 

アイキャッチ画像のサイズが合わない

プラグインを使わずにサイズを合わせたい

 

このような問題を解決していきます。

 

トップページのアイキャッチ画像のサイズが合っていないと、ちょっと統一感に欠けますよね。

 

僕自身も最近までアイキャッチ画像のサイズを揃えていなかったんですが、調べると簡単にサイズを揃えることが出来たので共有したいと思います。

 

今回紹介するやり方はプラグインやツールを使わないので、無駄にプラグインを増やしたくない人には特におすすめです。

 

サイズを揃える方法はかなり簡単ですので、良いと思ったらやってみてください。

 

NOJI
アフィンガー以外の人でもOKだよ!

 

アイキャッチ画像サイズ(高さ)の揃える方法

 

それでは早速画像サイズを揃えていきましょう。

 

step
1
画像編集画面を開く

 

最初にサイズを揃えたい画像の編集画面を開きます。

 

アイキャッチ画像 サイズ(高さ)揃える方法_1

 

step
2
縦横比を設定する

 

画像を編集する画面が表示されたら、左上の「トリミングボタン」をクリックします。

 

 

トリミングボタンをクリック後、縦横比を「16:9」に設定します。

 

 

アイキャッチ画像の縦横比率は「16:9」が主流となっているため、「16:9」に設定しています。

 

step
3
画像を切り抜く

 

縦横比を指定すると以下のようにトリミング範囲が指定されていますので、お好みの位置に調整します。

 

 

調整したら、「保存」をクリックして完了です。

 

 

サイズが大きめの画像は若干切り取る必要があるので注意しましょう。

 

アイキャッチ画像のサイズ(高さ)を揃える

 

アイキャッチ画像を上記の縦横比率「16:9」にすることで全てのサイズが揃って、統一感のある記事一覧になると思います。

 

例えばですが、僕のブログのトップページも以下のように統一感のあるトップページになりました。

 

画像サイズを揃える前

アイキャッチ画像 サイズ(高さ)揃ってない

 

画像サイズを揃えた後

アイキャッチ画像 サイズ(高さ)揃ってる

 

NOJI
ん〜サイズ揃ってる方が絶対良いね!

 

まとめ:ワードプレスのアイキャッチ画像サイズ(高さ)は縦横比「16:9」

【ワードプレス】アイキャッチ画像のサイズ(高さ)を揃える方法【ツール&プラグインなし】

 

以上、ワードプレスのアイキャッチ画像サイズの揃え方でした。

 

自分では中々気にならないかもしれませんが、サイトを見てくれてるユーザーからは少し気になる部分です。

 

簡単な作業で出来るので、是非やってみてください。

 

AFFINGER(アフィンガー)カスタマイズ CSS
【アフィンガーカスタマイズ】見た目をさらにおしゃれにするCSSまとめ集

続きを見る

【特典付き】有料テーマならAFFINGER5(アフィンガー5)がおすすめ!【魅力を徹底解説】
【特典付き】有料テーマならAFFINGER5(アフィンガー5)がおすすめ!【魅力を徹底解説】

続きを見る

 

-WordPress
-,

Copyright© NOJI BLOG , 2019 All Rights Reserved.