PR

【WordPress】『cocoon』使用中ブログのサムネイルがキレイになった話

↓これがキレイになる前の『サムネイル』。

WordPressサムネイルぼやける

↓こちらがキレイになった『サムネイル』。

WordPressサムネイルきれい

画像がくっきり、はっきり見えるようになりました。見比べてみると、今までこんなにぼやけてたことに驚きます・・・。

 

スポンサーリンク

サムネイルをキレイにした方法

テーマのサムネイルをRetinaディスプレイ対応させる方法(スマホで画像がぼやける対策)
Cocoonテーマ内のサムネイル画像をRetinaディスプレイ対応させる機能の紹介。

このやり方の通りにやったらキレイになりました。

私はRetinaディスプレイ対応のスマホじゃなくても、サムネイルがぼやけて見えていたので、最初は

 

(´-`).。oO この方法は私には合ってないのでは?

 

と思いましたが、パソコンでぼやけて見えてる状態でも、こちらの方法で解決出来ました。

 

いくつか気になったことのメモ

403エラーが表示されて困った

cocoon設定→画像→『サムネイルをRetinaディスプレイに対応する』にチェックを入れる→403エラーが表示されて変更出来ない

私は『ロリポップ!』のサーバーを借りているので、ロリポップ!のユーザー専用ページの、WAF設定を一時的に『無効』にする。

WordPressにログインし直す。

もう一度、『サムネイルをRetinaディスプレイに対応する』にチェックを入れて設定変更してみる。

今度はエラーが出ずに、設定変更出来た。

ロリポップ!のWAF設定を『有効』に戻す。

Regenerate Thumbnailsプラグインで画像の再生成をする

『サムネイルをRetinaディスプレイに対応する』の設定だけでサムネイルがキレイになった人もいるらしいですが、私はまったく変わりませんでした。なので、『Regenerate Thumbnails』プラグインで画像の再生成をしました。

画像が6000枚ぐらいあったので、時間がそこそこかかりました。30分~1時間ぐらい。ずっと見てたわけではないので、正確な時間はわかりません。

エラー発生!

再生成が終わったのでパソコン画面を見ていたら、いくつものエラーが・・・!なんのこっちゃ、わからなかったのでエラー表示の部分にあったリンク↓をクリック。

WordPress でのデバッグ
どのプロジェクトでもPHP コードのデバッグは共通ですが、WordPress にはプロセスの簡素化目的にデザイ…

読んでもなんだかわからず、元のページに戻ったらエラーの説明が全部消えてました。/(^o^)\

 

これ、何も解決させてないけど大丈夫なのかな・・・。とりあえず、しばらく様子見で。時間がある時、また調べてみます。

 

エラー表示がされて以降、ダッシュボードに

EWWW Image Optimizer で複数の画像の過剰な再ー最適化が検出されました。再ー最適化された画像を表示するには、ツールページをご利用ください。

という表示が出るようになりました。

 

終わりに

サムネイルの画像がキレイになったことが、思ったより嬉しかったです。ついでにサイズがちょっと大きかったサムネも同じサイズになったのも良かった!