サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2022年11月4日 21:46
モバイルサイドバーの開閉が少しおかしいような気がします。
①
サイドバーの検索窓を選択した途端に、サイドバーが閉じてしまい、入力ができない感じです。
（日本語入力のキーボードが出てきた瞬間に閉じてしまう）
以下は、Android実機で、日本語入力は「Gboard」です。
（他の日本語入力（ATOK）でも同様の動作でした）
デベロッパーツールでは、日本語入力が出てきませんので、再現しませんでした。
②
同一ページ内のリンクを選択した場合に、サイドバーが閉じないようです。
（リンク先が別ページであれば、閉じるみたいです）
（リンク先が別ページであれば、閉じるみたいです）
以下は、デベロッパーツールのものですが、Android実機でも同様でした。
わいひら reacted
トピックスターター 2022年11月4日 22:16
検索窓の件ですが、先程添付したものは、Android12のものです。
Android10（別機種）の端末でも確認しましたが、同様に検索窓を選択した途端に、サイドバーは閉じてしまいます。
古い機種ですので、少し反応が遅いですが、検索窓選択後に日本語入力が出てきて、サイドバーが閉じてしまうという動作は同じです。
わいひら reacted
2022年11月4日 23:04
分かる範囲で回答します。
●回答①
iPhoneXr、Safariでは本現象は発生せず。
サイドバーが閉じる要因は、ウィンドウサイズが変更される事に起因します。
https://wp-cocoon.com/community/postid/65446/
●回答②
----------------------------------------------
テーマ名：Cocoon
バージョン：2.5.0
カテゴリ数：19
タグ数：146
ユーザー数：1
----------------------------------------------
以前から、同一ページ内のアンカーにジャンプするので、フッターモバイルボタン「サイドバー」は閉じません。
サイドバーにウィジェット「目次」を配置すれば分かります。
もしクリック時、閉じるよう仕様変更するなら以下に追加が必要です。
/* リンクをクリックしたら、サイドバーを閉じる */
$('a').click(function() {
$('#sidebar-menu-input').prop('checked', false);
});
わいひら reacted
トピックスターター 2022年11月4日 23:17
サイドバーが閉じる要因は、ウィンドウサイズが変更される事に起因します。
だとすると、Androidでは、入力ができなくなってしまいます。
以前から、同一ページ内のアンカーにジャンプするので、フッターモバイルボタン「サイドバー」は閉じません。
いえ、以前は少なくとも、コメント欄は閉じていました。
デベロッパーツール上でも、閉じます。
（実機でも同様です。）
「同一ページ上は、これからは閉じないのが仕様」ということも、有りだとは思います。
ただ、入力ができないのは厳しい気がします。
わいひら reacted
2022年11月5日 00:27
いえ、以前は少なくとも、コメント欄は閉じていました。
確認しました。
●補足
ページのURLが含まれるか否かで動作が違う。
- 目次、#toc1
- コメント、ページURL+#comment-40
●原因②
フッターモバイルボタン「サイドバー」のメニューリンクがクリックされたか上記の部分で判定している。
Ver2.5.1で動的にPCサイドバーをモバイルサイドバー(#slide-in-sidebar)とした。
「サイドバー」をクリックしないとサイドバー#slide-in-sidebarは存在しない。
この為、上記の部分が動作せず、サイドバーが開いたままになる。
●対策
以下の部分に以下の部分を移動する。
//モバイルサイドバーをクリックしたら閉じる
drawerCloser('#slide-in-sidebar a', '#sidebar-menu-input');
わいひら reacted
2022年11月5日 01:25
Android10 / Chromeでは再現し
Android持っておらず。
ポイントはWindow:resizeイベントが起きているかですね...
わいひら reacted
トピックスターター 2022年11月5日 01:36
Androidの開発環境がある訳ではありませんので、細かいことは分からないです。
ただ、検索窓の件は、Androidで発生することは間違いなさそうですね。
はるさん、いつもありがとうございます。
わいひら reacted
2022年11月5日 01:50
先の動作を見ると、下から入力パッドが出ており。
ウィンドウの高さが変化しているなら、以下の部分を置換えれば分かるかと。
幅が変わった時のみサイドバーを閉じます。
//リサイズした時はサイドバーを元に戻す
var vw = window.innerWidth;
$(window).resize(function () {
if (vw != window.innerWidth) {
$('#sidebar-menu-input').prop('checked', false).change();
}
vw = window.innerWidth;
});
わいひら reacted
トピックスターター 2022年11月5日 02:24
chu-yaさん
ありがとうございます。
既に手元にはスマホしかなく・・・。
私のサーバー環境は、まだCocoonを最新にバージョンアップしていないこともあり、明日確認させていただきます。
しかし、明日もしばらくスマホしかない状態が続きますので、夜遅めの確認になると思います。
（先にどなたかが、ご確認くださると嬉しい・・・）
トピックスターター 2022年11月5日 19:16
検索窓の件。
幅が変わった時のみサイドバーを閉じます。
//リサイズした時はサイドバーを元に戻す var vw = window.innerWidth; $(window).resize(function () { if (vw != window.innerWidth) { $('#sidebar-menu-input').prop('checked', false).change(); } vw = window.innerWidth;
上記chu-yaさんご提示のコードで、解消されたように思います。
（サーバー上に新規環境を作って、Cocoonも新規インストール、上記コードを上書いただけの環境で確認しました。あまり他の部分の確認はしていません）
わいひら reacted
2022年11月5日 22:09
サイドバーのクリックに関しては、chu-yaさんのコードをまま使わせていただきました。
chu-yaさんありがとうございます！
------------------------------------------------
https://github.com/xserver-inc/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。
WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------
2022年11月5日 22:13
2022年11月5日 23:12
はい、トップページでも発生しますね。
Ver2.5.1.1でも対応不十分と言う事ですか？(YES/NO)
---
以下ですが、slide-in-sidebarの動作なので、検索窓とは関係ないです。
トピックスターター 2022年11月5日 23:15
Ver2.5.1.1でも対応不十分と言う事ですか？(YES/NO)
いえ、そういうことではないと思います。
わいひらさんが何を気になさったのかは分かりませんけれど。
トップページと、フォーラムのサイドバーの検索窓は、違うものですので、その辺り？
トピックスターター 2022年11月5日 23:25
以下ですが、slide-in-sidebarの動作なので、検索窓とは関係ないです。
はい、理解しています。
私が確認のためにサーバーに作った環境では、Cocoon公式サイトで言えば、トップページにある検索窓と同じものを設置して確認しました。
フォーラムの検索窓は、設置がちょっと面倒くさいので、私のテスト環境では設置していません。
2022年11月6日 01:15
トップページと、フォーラムのサイドバーの検索窓は、違うものですので、その辺り？
報告があったのはGoogle検索の方だったので、どっちでも同じなのかなと単に思いました。
先のmk2さんの指摘の以下の部分の移動が漏れています。
確認願います。
実装忘れ恐れ入ります。
GitHubと当サイトに適用しておきました。
トピックスターター 2022年11月6日 03:07
ご対応いただき、ありがとうございます。
Cocoon公式サイトにて確認させていただきました。
Android実機でも問題ないと思います。
わいひら reacted
2022年11月6日 14:13
ご確認いただきありがとうございます！
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。