制作のご相談はこちら
no image

公開日 : 2021年12月18日

ワードプレスでサムネイル画像がぼけるときのシンプルな対処法|画像サイズを変更して一括更新

ワードプレスでウィジェットを使って記事を並べていると、サムネイル画像がぼけてしまうウィジェットがたまにあります。

ぼけてしまう理由は簡単で画像サイズよりも大きく表示させているためです。

プルダウンなどでサムネイルのサイズを変更することができるテーマやウィジェットであれば、大きいサイズに変更するだけで解決できるでしょう。

ただ、そういった選択肢が無い場合はどうすればよいでしょうか?

せっかく使いたいデザインのウィジェットが見つかったのに画像がぼける…。

そんなときに一番シンプルに解決できる方法をご紹介します!

画像のぼけが気になったとき、まずこの方法で治るか確認してみてください!

サムネイル画像がぼけるのは画像が小さいから

サムネイルに使われる画像はだいたいのウィジェットが自動で設定されます。

デフォルトの設定から大きいものや小さいものを選べるウィジェットであれば良いですが選べない場合どうしたらいいのか?

そんなときはまず、「ダッシュボード」→「設定」→「メディア」の画像サイズを確認します。

設定から画像サイズを確認する

画像サイズを変更する

サムネイルに使われるのは「サムネイルのサイズ」か「中サイズ」だと思います。

中サイズの幅の上限や高さの上限が「300」や「400」になっていると、コンテンツの横幅に届いていない場合があり、そのためぼけている可能性大です。

あまりに大きいサイズではサイト読み込み速度が気になるので中サイズは「600」ぐらいに設定しておくのがおすすめ。

600にしておけばだいたいのデバイスできれいに表示されます。

もっと大きいものは「大サイズ」を選んだり、サイズを変更して調整しましょう。

画像サイズを一括変更する

画像サイズを変更して適用されるのは変更後にアップロードした画像だけ。

そのため、いま現在ぼけてしまっている過去にアップロードしている画像はすべてリサイズする必要があります。

1つずつリサイズするなんてことは働き方改革の時代に合わないのでプラグインを使ってさくっと変換してしまいましょう!

おすすめなのが【Regenerate Thumbnails】というプラグインです。

使い方は簡単。

インストールして有効化するとダッシュボードのレフトナビのツール内に「Regenerate Thumbnails」が追加されるのでクリックします。

すると以下のような画面が表示されるので、「アイキャッチ画像からのみサムネイルを再生成」を選ぶだけ。

これで画像サイズで変更した値で既存の画像も一気にリサイズされます!

リサイズが完了したらフロントで画像を確認してください。きっとぼけが解消されているはずです!

以上、サムネイル画像がぼけるときの対処法でした。