サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2018-11-24 03:31
Lazy Load機能の実装ありがとうございます。
SEO対応と書いてありましたがネットで調べるとLazy Loadを使う場合検索エンジンのクローラーは画像を認識できないとあります。
これについて設定しなければならない事などはありますでしょうか？
また対策されている内容がわかれば知りたいです。
https://www.suzukikenichi.com/blog/two-ways-to-have-lazy-loading-images-indexed/
また、Lazy Load機能はユーザーが見えるエリアに画像が入った時に読み込まれる仕組みかと思いますが、Cocoonページなのでもそうですがヘッターロゴが表示されるまでにタイムラグが発生しており、画像が表示されるのが気になるほどです。
他のサイトや一般的に過去見た事あるサイトではこの現象を一度も見た事がないので不可解な感覚を覚えます。何か対策があればお願いしたいと思います。
よろしくお願いします。
2018-11-24 03:49
SEO対応と書いてありましたがネットで調べるとLazy Loadを使う場合検索エンジンのクローラーは画像を認識できないとあります。
これについて設定しなければならない事などはありますでしょうか？
また対策されている内容がわかれば知りたいです。
この件については、以下スレッドあたりでしょうか。
Lazy Load の情報の補足です。
公開された Google のドキュメント
Make sure Google can see lazy-loaded content
Google が薦める Intersection Observer API を使った Lazy Load のコードサンプル。
Lazy load images using IntersectionObserver
w3c が提供する Intersection Observer API の polyfill 。
ただ、よほど画像の枚数が多いか、画像サイズがバカでかくないと、Lazy Load は効果を実感できないかも。数ヶ月前に自分のブログで実装して WebPageTest で計測したら、まったく速くならず実装をやめました。PageSpeed Insights の点数は上がるでしょうけど。
このリンク先の情報前後あたりをチェックしてみるのも良いかと思います。
わいひら reacted
2018-11-24 22:22
かうたっくさんが書かれたトピックにほぼ書かれています。
クローラー的には、noscriptを用いてクロール出来るようにしてあります。
Cocoonページなのでもそうですがヘッターロゴが表示されるまでにタイムラグが発生しており、画像が表示されるのが気になるほどです。
僕の環境からは、特に遅いとは感じないです。
Lazy Loadの仕様上、微細なラグは発生するのは致し方ないかと思います。
気になる場合は、無理に使用せずとも使用しないという選択肢もあるのではないでしょうか。
他のサイトや一般的に過去見た事あるサイトではこの現象を一度も見た事がないので不可解な感覚を覚えます。何か対策があればお願いしたいと思います。
そういうサイトがあるのであれば、比較のためにもURLを提示していただければと思います。
2018-11-25 10:19
わいひらさん
エックスサーバーのキャッシュ・高速化関連は無効に設定してもしなくてもエックスサーバーでは以下のようになるみたいです。
Cocoon設定、高速化より。
- ブラウザキャッシュを無効・Lazy Load機能を有効に
または
- Lazy Load機能のみ無効の場合。
Cache-Control：max-age=1に
- 全項目にチェックを入れた場合
Cache-Control：max-age=31536000
となるようです。
今アチコチで話題が出ていて『Xアクセラレータに関わる不具合』やらも関係あるかもしれません。
これは推奨されている静的ファイル
ON [静的ファイル](推奨)
静的ファイルに対してXアクセラレータが有効になります。サーバー側で静的ファイルは2分間キャッシュされます。
これを有効にしていてもしてなくても同様です。
ON [全ファイル]
全てのファイルに対してXアクセラレータが有効になります。サーバー側で静的ファイルは2分間、動的ファイルは1分間キャッシュされます。※ECサイトやログインしたユーザーのみに表示するコンテンツなど、キャッシュ処理を想定していないコンテンツ運用の場合、正常に表示されないことがあります。
コチラのほうは試してませんが。
https://www.xserver.ne.jp/manual/man_server_xaccelerator.php
あと
サイドバーのウィジェットの一部が表示されなく/#post-9026
- 時間を置いたらキャッシュが切れた問題後の書き込み
- Cocoonバージョン：1.4.0.1
- lozad lozad-img有り
ご指摘いただきましたサーバーのキャッシュ機能（＝ブラウザキャッシュ設定）を確認してみましたが、OFFになってました（そんな機能もあったんですね…）。
これも関係しそうです。
2018-11-28 19:50
横入りで申し訳ございません。実は当サイトも同じ状況で、ヘッターロゴが表示されるまで、タイムラグが発生しています。
設定状況は、Cocoonの高速化設定を、すべてチェック済み。
ちなみに、エックスサーバーの高速化設定は、以下のようになっています。
- XアクセラレータはOFF。
- mod_pagespeed設定もOFF。
- ブラウザキャッシュ設定はON[全ての静的ファイル]。
念のため、Cocoon環境に関する情報も、載せておきます。
----------------------------------------------
ホームURL： https://doteiban.net
コンテンツURL：/wp-content
インクルードURL：/wp-includes/
テンプレートURL：/wp-content/themes/cocoon-master
スタイルシートURL：/wp-content/themes/cocoon-child-master
使用スキンURL：
Wordpressバージョン：4.9.8
PHPバージョン：7.2.6
ブラウザ：Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:63.0) Gecko/20100101 Firefox/63.0
サーバーソフト：Apache
サーバープロトコル：HTTP/1.1
言語：ja,en-US;q=0.7,en;q=0.3
----------------------------------------------
テーマ名：Cocoon
バージョン：1.4.1
カテゴリ数：19
タグ数：328
ユーザー数：1
----------------------------------------------
子テーマ名：Cocoon Child
バージョン：0.0.5
----------------------------------------------
利用中のプラグイン：
BackWPup 3.6.6
Contact Form 7 5.0.5
Edit Author Slug 1.6.0
EWWW Image Optimizer 4.5.1
Google XML Sitemaps 4.0.9
Limit Login Attempts 1.7.1
Optimize Database after Deleting Revisions 4.7.2
Protect Uploads 0.2
Remove Query Strings From Static Resources 1.4
RSS Image Feed 4.2.5
Search Regex 1.4.16
SiteGuard WP Plugin 1.4.3
Throws SPAM Away 2.9
Visual Editor Custom Buttons 1.5.2.2
WebSub/PubSubHubbub 3.0.1
WordPress Ping Optimizer 2.35.0.1.3
WP Fastest Cache 0.8.8.8
WP Multibyte Patch 2.8.1
----------------------------------------------
2018-11-29 04:38
h ttps://doteiban.net
にアクセスすれば爆速でロゴが表示されました。
-------追記----------
ログインユーザーでないので爆速で表示されたのかも知れないですね？キャッシュプラグインの設定が不明ですが。
------------------
ただそのタイムラグが一瞬のことであるのであれば、Cocoonも私のページも一瞬壊れた画像が表示されますね。
altなし状態です。
***
ほかは投稿ページで『一部の画像が画像が小さく表示される』場合もあります。これは提示可能ですが、ややこしいので一応ソースのみ。
width="224" height="28" 幅が244px 高さは298.06px。AMPならエラーが出そうな細かい数字です。
<img class="alignnone size-full wp-image-341 lozad lozad-img" data-src="https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png?resize=505%2C672&ssl=1" alt="ユーザー用のサイトマップ例" width="224" height="28" data-srcset="https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png?w=505&ssl=1 505w, https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png ?resize=225%2C300&ssl=1 225w, https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png ?resize=301%2C400&ssl=1 301w" sizes="(max-width: 505px) 100vw, 505px" src="https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png?resize=505%2C672&ssl=1" srcset="https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png?w=505&ssl=1 505w, https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png ?resize=225%2C300&ssl=1 225w, https://i0.wp.com/bibabosi-rizumu.com/wp-content/uploads/2015/03/099c03d795fec4514a4a3f325e951c28.png ?resize=301%2C400&ssl=1 301w" data-loaded="true">
- あとlazy-Loadを停止したとき
lozad lozad-imgのclass属性が消えてない。さらになぜか画像が表示されないときに出る『壊れた画像マーク』になってしまう事もありました。
コチラはプラグインのttps://i0.wp.com/を利用してないサイトです。
公開前だったので、全部昨日修正しましたが。altを書いていてもaltが表示されなかった感じですね。イロイロ謎ですが。
This post was modified 5年前 by かうたっく
2018-11-29 04:47
あと、今ビバ★りずむ：私のページでログインを求められましたが、画像が表示されてないですね。
<img class="lozad lozad-img" data-src="画像のパス" alt="CAPTCHA">
https://gyazo.com/0dbebad4891e650b63d95b7a7ffdd4f9
原因の可能性があるかも知れないけど、いまは不明ですが。
******追記
一応対処方法
ソースコードで画像のパスを見て表示。それで入力。※設定かもですが、
- もし404になった場合
プラグインで表示させているので、FTPでそのプラグインフォルダ名を変更して強制エラーを出して停止。
普通にログインをする。
**
This post was modified 5年前 by かうたっく
2018-11-29 22:18
> https://doteiban.net/
僕が見る限りでは、普通に表示されているようです。全然遅くないと思います。
ただLazy Loadという名前の通り、多少なりともタイムラグは出るのはしょうがないです。
どうしてもタイムラグを発生させたくない場合は、Lazy Loadを無効にすればよいのではないでしょうか。
Lazy Loadを有効にしていたからといって、良くなるのはPageSpeed Insightsのスコアだけです。
多くの人が、PageSpeed Insightsのスコアでテーマの善し悪しを判断される傾向があるので、一応対応はしていますが、ブログの本質はスコアではないと思います。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。