サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2019年9月18日 03:32
こんにちは。
表題に関して質問致します。
私のブログではトップページ表示を縦型カード3列を採用しておりますが、どうもサムネイルやロゴ画像がぼやけているのに最近気づきました。
ロゴ画像に関してはなぜか投稿ページに移動すると綺麗なロゴ画像が表示されます。
デベロッパーツールで確認しても、画像が置き換わったような形跡はありませんでした。
またサムネイルに関しては別トピックでfunction.phpの追記する方法を試しましたが、改善はありませんでした。再生性は何度か試しましたがこちらも改善せず。
よろしければご確認いただけないでしょうか。
該当URL： https://fmoga.com/
参考にしたURL：
1つ目
2つ目
2019年9月18日 19:07
サムネイルのぼやけに関しては、Retinaディスプレイ対応していただくと良いかと思います。
https://wp-cocoon.com/retina-thumbnail/
ロゴに関しては、Cocoon設定「ヘッダー」タブの「ヘッダーロゴ」に倍の大きさの画像を設定して、「ヘッダーロゴサイズ」を半分の値に設定するとどうでしょうか？
Topic starter
2019年9月18日 22:50
わいひらさん返信ありがとうございます。
Retinaディスプレイ設定に関してはすでに行っており、設定したあとに再生成も試してみて今の状態でした。
ロゴに関しては1280pxのロゴにして、「ヘッダーロゴサイズ」で小さくしてみてましたが、トップページではボケが発生してしまいます。
投稿ページではきれいなのですが、この違いってなんでしょうか。
2019年9月19日 06:27
デベロッパーツールで確認しても、画像が置き換わったような形跡はありませんでした。
ロゴに関しては1280pxのロゴにして、「ヘッダーロゴサイズ」で小さくしてみてましたが、トップページではボケが発生してしまいます。
実際ボケている状態が確認できないので微妙ですけど、キャッシュが残っているなどないですか？
h ttps://fmoga.com/wp-content/uploads/2019/09/fujilogo.png
ファイル名を変更・Cocoon設定で再セットしてから、画像の再生成。その後トップページに入って確認してキレイに表示されていれば、キャッシュが原因の可能性が高いと思いますよ。
わいひら reacted
2019年9月19日 18:24
インデックスページのサムネイルのソースにpictureとかsourceとかCocoonが使用していない要素が入っているんですけど、これは何で出ているんでしょう？ログインとかでしょうか。
ここら辺を環境情報がないと何とも言えないかもしれません（わかっても原因がわからない可能性もあるけど）。
https://wp-cocoon.com/theme-report/
2019年9月19日 18:29
サイトロゴについても、ぼやけているようにはAndroid環境からは見えませんでした。
トップページのもの。
2019年9月19日 18:32
投稿ページのもの。
これに関しても、端末とブラウザーの情報がないと、同じ環境で確認しているとは言えないので、何とも言えないかもしれません。
Topic starter
2019年9月20日 02:00
＞＞かうたっくさん
ご返信ありがとうございます。
ご指摘の手順で行ってみましたが改善はありませんでした。
＞＞わいひらさん
pictureとかsourceは「ShortPixel Image Optimizer」という画像プラグインのせいかもしれません。webp配信のために付与されています。
念の為停止してみましたが、特に変化はありませんでした。
----------------------------------------------
サイト名：フジモガ
サイトURL： https://fmoga.com
ホームURL： https://fmoga.com
コンテンツURL：/wp-content
インクルードURL：/wp-includes/
テンプレートURL：/wp-content/themes/cocoon-master
スタイルシートURL：/wp-content/themes/cocoon-child-master
子テーマスタイル：/wp-content/themes/cocoon-child-master/style.css
Wordpressバージョン：5.2.3
PHPバージョン：7.3.8
ブラウザ：Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36
サーバーソフト：LiteSpeed
サーバープロトコル：HTTP/1.1
エンコーディング：gzip, deflate, br
言語：ja,en-US;q=0.9,en;q=0.8
----------------------------------------------
テーマ名：Cocoon
バージョン：1.9.6.4
カテゴリ数：17
タグ数：0
ユーザー数：1
----------------------------------------------
子テーマ名：Cocoon Child
バージョン：1.0.8
----------------------------------------------
Gutenberg：1
AMP：0
PWA：0
Auto Post Thumbnail：0
ホームイメージ：/wp-content/uploads/2019/03/logokabegami.jpg
----------------------------------------------
ブラウザキャッシュ有効化：0
HTML縮小化：1
CSS縮小化：0
JavaScript縮小化：1
Lazy Load：0
WEBフォントLazy Load：0
JavaScript（フッター）：1
----------------------------------------------
利用中のプラグイン：
Category Order and Taxonomy Terms Order 1.5.7
Flying Pages 2.0.8
Google XML Sitemaps 4.1.0
Lazy Load for Comments 1.0.10
LiteSpeed Cache 2.9.8.5
plugin load filter 3.1.0
Regenerate Thumbnails Advanced 2.1.0
Search Regex 1.4.16
ShortPixel Image Optimizer 4.14.5
TinyMCE Advanced 5.2.1
UpdraftPlus - Backup/Restore 2.16.17.24
WebSub/PubSubHubbub 3.0.3
WP Cerber Security, Antispam & Malware Scan 8.4
WPForms Lite 1.5.5.1
WP Mail SMTP 1.6.2
----------------------------------------------
ボケはスマホ表示では再現なく、Chromeブラウザで見た時にのみ発生するようです。
そう思い、MicrosoftEdgeで確認したらロゴのボケがなくなっていました。
もしかしたら自分の環境のせいで表示がおかしいのかもしれません。
2019年9月20日 02:22
＞＞かうたっくさん
ご返信ありがとうございます。
ご指摘の手順で行ってみましたが改善はありませんでした。
トップページの画像のパスは現在以下の通りです。
<img class="site-logo-image" src="h ttps://fmoga.com/wp-content/uploads/2019/09/fujilogo.png" alt="フジモガ">
前回のトップページロゴ画像のパスは以下。
h ttps://fmoga.com/wp-content/uploads/2019/09/fujilogo.png
h ttps://fmoga.com/wp-content/uploads/2019/09/fujilogo.png
今回のは上記
パスやファイル名は何も変わってないように見えますけど、これはキャッシュLiteSpeed Cacheのせいでしょうか？？？
***
キャッシュの削除をしてもダメ。ってことですか？
pictureとかsourceは「ShortPixel Image Optimizer」という画像プラグインのせいかもしれません。webp配信のために付与されています。
ただの可能性としてだけですが、原因がテーマでない可能性も十分のこってるように思えるので、その可能性を皆無にしてみたら、残る原因が見えてくると思われます。
**
あと。上記キャッシュを削除できている状態で
Chromeのキャッシュがない状態：シークレットモードなどでチェックしても同じですかね？？？
どこに原因があるんだろ？っと思うので、サーバーのキャッシュも怪しい気もしますが、何等かのキャッシュを使ってませんか？？？
他思うのはどれほどボケて見えてらっしゃるかが分からないんです。
正常な状態とボケてる状態の画像をご提示いただけますか？？？
あえて拡大してないので、かなり見にくいかもですが、こちら側から見えているのは以下の通りです。トップページの画像
わいひら reacted
2019年9月20日 18:06
pictureとかsourceは「ShortPixel Image Optimizer」という画像プラグインのせいかもしれません。webp配信のために付与されています。
僕は停止した状態の動作を見ていないので、何とも言えないです。現在もタグは出力されているようなので。
2019年9月21日 21:57
現在の状態でサムネイルがぼけていますか？
ちょっとぼけているようには見えないんですけど。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。