サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Cocoonテーマに関する質問
13
投稿
3
ユーザー
14
Reactions
1,302
表示
トピックスターター 2022年12月22日 15:25
いつもCocoonとわいひら様、フォーラムで活動されている方々など大変お世話になっております。
Cocoonにて複数サイトを運用しているのですが、いつのまにか表題の状態になっていました。
不具合・カスタマイズ対象ページのURL： https://wordpress-solution.info/
相談内容：
TOPページ内、リストになっている記事を押下後、ブラウザのもとに戻るを押して戻った際にスクロールバーが表示されない。画面をスクロールすれば表示されるが、その際スクロールバー表示のため画面が一瞬ガタついて見える
以前はこのようなことはなかったかと思いますが、以前からの仕様でしょうか？それともGoogleChrome側の仕様でしょうか…？できればスクロールバーが誰が見ても表示され、ガタついてみえないようにしたいです。
こちらの環境のミスかと思い新しくテストサイトを立ち上げて確認してみましたが、同様のことが発生します。
他のCocoonでできたサイトを拝見すると、大丈夫なサイトと同様のことが起きているサイト（ごく少数）にわかれていました。
不具合の発生手順：
・GoogleChromeで上記URLを開き（シークレットモードではなく普通のタブ）、ctrl+F5押下後、一番上のテスト投稿10を押下→ブラウザの前に戻るボタン押下
発生する確率がバラバラなので、発生しなければ同じようにテスト投稿10 戻るボタン、投稿9 戻るボタン、 8 7 6...と押下、戻る、を繰り返せば発生しやすいかと思います。
解決のために試したこと：
・WordPressバージョン変更、Cocoon更新、ブラウザ変更、プラグイン停止、ローカル立ち上げ、PHPバージョンアップ（7.4→8）
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：
・Windows10
・GoogleChromeの最新
・シークレットモードでは同じ現象は起きないが、ブラウザ側でキャッシュ削除してもctrl+F5にてすぐ復活する
※結局ユーザはガタついているものを見ることになる
・FireFoxでは確認できない
・ローカル環境で同じサイトを立ち上げても同じことは起きない
・プラグイン全て停止でも同様
・コクーンキャッシュは全て削除
URLは他の方のサイトなので貼れませんが、ごく一部のサイトで同様のことがおきていました。
高速化設定などやfunctions.php,cssなども初期のままで触っていません。
----------------------------------------------
サイト名：test
サイトURL： https://wordpress-solution.info/---
ホームURL： https://wordpress-solution.info
コンテンツURL：/---/wp-content
インクルードURL：/---/wp-includes/
テンプレートURL：/---/wp-content/themes/cocoon-master
スタイルシートURL：/---/wp-content/themes/cocoon-child-master
親テーマスタイル：/---/wp-content/themes/cocoon-master/style.css
子テーマスタイル：/---/wp-content/themes/cocoon-child-master/style.css
WordPressバージョン：6.1.1
PHPバージョン：8.0.25
ブラウザ：Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36
サーバーソフト：Apache
サーバープロトコル：HTTP/1.1
エンコーディング：gzip, deflate, br
言語：ja,en-US;q=0.9,en;q=0.8
----------------------------------------------
テーマ名：Cocoon
バージョン：2.5.4.4
カテゴリ数：1
タグ数：0
ユーザー数：1
----------------------------------------------
子テーマ名：Cocoon Child
バージョン：1.1.3
style.cssサイズ：845バイト
functions.phpサイズ：203バイト
----------------------------------------------
Gutenberg：1
AMP：0
PWA：0
Font Awesome：4
Auto Post Thumbnail：0
Retina：0
ホームイメージ：/---/wp-content/themes/cocoon-master/screenshot.jpg
----------------------------------------------
ブラウザキャッシュ有効化：0
HTML縮小化：0
CSS縮小化：0
JavaScript縮小化：0
Lazy Load：0
----------------------------------------------
利用中のプラグイン：
All-in-One WP Migration 7.69
SiteGuard WP Plugin 1.7.3
----------------------------------------------
※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
2022年12月22日 18:33
mysanc0303さん
そんなに何回も確認はしておりませんが、私が確認すると、Chromeでは発生し、Edgeでは発生しない感じです。
同じChromiumで発生しないということは、Chromeの問題？
私のローカル環境等では、この事象を発生させることができず、試すことができないのですが・・・。
以下のようにすると、変化はありますでしょうか。
body.front-top-page {
overflow-y: scroll;
}
mysanc0303 and わいひら reacted
2022年12月22日 19:32
シークレットモードでは同じ現象は起きないが
であれば、拡張機能が原因かもしれません。
私の Chrome では、常にスクロールバーが表示されています。サイト側の問題ではなく、mysanc0303 さんの Chrome 側の問題のように思えます。
以下のことをお試しになるとどうなるでしょうか？関係ないと思われるものも全て書いています。
- Chrome を最新のバージョンに更新します。お使いのバージョンは古くはありませんか？
- Chrome の「閲覧履歴データの削除」から、とりあえず全て削除します。※「パスワードとその他のログインデータ」は削除しなくても構いません。
- 拡張機能を全て停止します。
- Chrome 設定 > システムにある「ハードウェア アクセラレーションが使用可能な場合は使用する」が有効になっているか確認します。
- アドレスバーに「chrome://flags/#overlay-scrollbars」と入力し、「Overlay Scrollbars」が Default または Disabled になっているか確認します。
mysanc0303 and わいひら reacted
2022年12月22日 19:38
ちなみに、私も以下は確認しました。
- Chrome 設定 > システムにある「ハードウェア アクセラレーションが使用可能な場合は使用する」が有効になっているか確認します。
- アドレスバーに「chrome://flags/#overlay-scrollbars」と入力し、「Overlay Scrollbars」が Default または Disabled になっているか確認します。
更に、全拡張機能の無効化も試しましたが、やはり発生しますね。
（とはいえ、私の本番・ローカル環境等のサイトでは再現できず・・・）
Chromeのバージョンは「108.0.5359.125」です。
Chrome の「閲覧履歴データの削除」から、とりあえず全て削除します。※「パスワードとその他のログインデータ」は削除しなくても構いません。
上記は試しておりませんので、mysanc0303さんにお試しいただければと。
mysanc0303 and わいひら reacted
トピックスターター 2022年12月23日 09:29
早速のご返信ありがとうございます。
私の方でも拡張機能は無効化しましたが、発生しました。
また、頂いたCSS
body.front-top-page { overflow-y: scroll; }
を設定してみましたが、相変わらず発生します。（ＵＲＬのサイトに反映させています）
- Chrome を最新のバージョンに更新します。お使いのバージョンは古くはありませんか？
- Chrome の「閲覧履歴データの削除」から、とりあえず全て削除します。※「パスワードとその他のログインデータ」は削除しなくても構いません。
- 拡張機能を全て停止します。
- Chrome 設定 > システムにある「ハードウェア アクセラレーションが使用可能な場合は使用する」が有効になっているか確認します。
- アドレスバーに「chrome://flags/#overlay-scrollbars」と入力し、「Overlay Scrollbars」が Default または Disabled になっているか確認します。
上記も試させて頂きましたが、変わりません…
同じChromiumという確認方法があるのですね、勉強になります。
試しにエックスサーバで簡単インストール→COCOON選択（子テーマにチェック）で投稿記事を増やすと同様に時々スクロールバーが現れない状況になりました。
Chromeバージョンは
108.0.5359.125（Official Build） （64 ビット）
でした。win11でも表示は変わりませんでした。
トピックスターター 2022年12月23日 10:59
Chromeの問題？とmk２様がおっしゃられていたのでもしや、と思いChromeのバージョンを下げたところ
スクロールバーがしっかり表示されるようになりました。
試したバージョンは107.0.5034.107です。
その直後、最新にバージョンアップすると現象が復活しました。
Chromeの最新バージョンとコクーンの相性が悪いのでしょうか…
正常な表示にしたいのですが、同じコクーンでも大丈夫なサイトとダメなサイトでどの部分が違うのか分かりません。
手持ちのサイトは全て同じ状況でヒントがない状態です。
新規インストールサイトと正常に動いているサイトの差分で何かヒントなどいただけないでしょうか？（ウィジェット追加、など）
トピックスターター 2022年12月23日 11:31
編集ができず、五月雨式で申し訳ありません。補足です。
（また、誤って一瞬解決済みにしてしまいました。申し訳ないです）
新規インストールサイトと正常に動いているサイトの差分で何かヒントなどいただけないでしょうか？（ウィジェット追加、など）
youtubeをサイドバーに設定したところ、スクロールバーが正常に表示されるようになりました。
外部から引っ張ってくる？と考え他サイトから画像を引用してみましたが、こちらではうまく行きませんでした。
2022年12月23日 12:28
mysanc0303さん
はっきりとは分かりませんが、やはりChrome特有の問題な気がします。
（相性とかではなく）
この辺りは、ブラウザの仕様にお詳しい方でないと難しいかもしれないです・・・。
mysanc0303 reacted
トピックスターター 2022年12月23日 13:16
mk２様 Akira様
ご返信・ご確認ありがとうございます。
Cocoonとの相性などではなくchrome特有の問題、ということで
「chrome側特有の問題であり、Cocoonの仕様などの問題ではない」
という事実が分かったここで解決、とさせていただきたく思います。
chromeの更新などで今後どうなるか、様子見をしていきたいと思います。
サイト複数の不具合で不安でいっぱいだったのですが、
検証やアドバイス下さり大変心強かったです。本当にありがとうございました。
わいひら reacted
2022年12月23日 13:41
@mysanc0303 さん
Chromium Bug Tracker で似ているバグの報告を見つけました。
最初に報告されたのは Chrome 104.0.5112.102 の時ですが、まだ解決していません。
Back-forward cache の無効で再現できなくなったと書かれているため、お試しになるといいかもしれません。
chrome://flags/#back-forward-cache
https://bugs.chromium.org/p/chromium/issues/detail?id=1355780#c27
何度試しても再現できないのですが、私であれば Chrome の初期化をすると思います。
わいひら and mysanc0303 reacted
トピックスターター 2022年12月23日 14:08
@akira 様
おおお！リンク先拝見させて頂きましたが、恐らくこれだと思われます！
大変すっきりしました、ありがとうございます！
スクロールバーが消え始めたのは最近ではなかったのですね…お恥ずかしい。
Back-forward cache の無効で再現できなくなったと書かれているため、お試しになるといいかもしれません。
上記、試してみたところ表示は正常になりました！ありがとうございます！
Chromeの初期化は行ったのですが、動作は変わりませんでした。
少し話は逸れます、本当に、本当にお時間があれば、可能であればお聞きしたいのですが、
このバグissueを検索する際はどのように検索・発見されているのでしょうか？
リポジトリなどを調べて見てみたりもしたのですが、自力での発見ができませんでした。
コツなどがあればお教えいただけないでしょうか…。
わいひら reacted
2022年12月23日 17:48
@mysanc0303 さん
Chromium の既存のバグは、Issues - chromium で確認できます。この Issues は、Chromium Bug Tracker と検索しても出てくると思います。
この Issues で「scroll overflow」と検索したら先のバグ報告が出てきました。
先のバグ報告を見ていて、Windows 10 だけの問題かもしれないなと思いました。mysanc0303 さんがお使いの OS は Windows 10。バグの報告をされた方も Windows 10 です。一方、不具合を再現できない私は、Windows 11 を使っています。また、macOS や Linux でも再現できないと書かれていました。
Windows 10でスクロールバーを常に表示 にして、Chrome の Back-forward cache を有効にしたら、どうなるのだろうと思いました。
この投稿は2年前 2回ずつAkiraに変更されました
mysanc0303 and わいひら reacted
トピックスターター 2022年12月23日 18:45
@akira 様
本当にありがとうございます！なるほど、そのように検索されているのですね！overflowのキーワードまでたどり着けませんでした。サイトのリンクなども丁寧にありがとうございます！いただいた情報をもとにこれからも精進してまいります！
OSについては
win11でも表示は変わりませんでした。
上記の通り、win11の最新のchromeでは事象の発生を確認しています。
同じOSなのに不思議です。
Windows 10でスクロールバーを常に表示 にして、Chrome の Back-forward cache を有効にしたら、どうなるのだろうと思いました。
本件、私も気になったので
Back-forward cache を有効
スクロールバー常に表示
で試してみましたが、状況同じになりました。添付ご確認ください。
（キャプチャで取れませんでしたがスタートのところが太いスクロールバーになっている状態で行いました）
詳細をお答えいただき本当にありがとうございました！！
わいひら reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。