サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2022年7月8日 00:33
相談内容:お世話になります。
ただ今seasonのテーマを使用しているのですが、初期の設定でグローバルメニューが横にスクロールするデザインとなっています。
とても良いデザインなのですが、メニューを増やすにあたって、一目でメニューの把握ができるよう全てのメニューを表示させたいと考えています。
<今のナビゲーションメニューの見た目>
[ホーム][おすすめ][みかん][スイカ]・・・(スクロールをすることで右部分が表示される)
↓
<希望するナビゲーションメニューの見た目>
[ホーム][おすすめ][みかん]
[スイカ] [メロン] [りんご]
分かりづらくてすみませんが、どの部分のコードをどのように変更したら良いかご教授いただけないでしょうか。
解決のために試したこと:インターネットの検索で方法や参考にできそうなコードを調べましたが、グローバルメニューをスクロール式にする方法は出てきますが、スクロール式から普通の(今目指しているもの)形式にする方法を見つけることができませんでした。
私自身プログラミングに詳しくなく、初めての質問なのでうまくできているか分かりませんが、よろしくお願いいたします。
2022年7月8日 01:06
前略、saaさん
スキンのseasonのデザインみたいなので、CSSでカスタマイズしないといけないのかもしれません。
追加CSSか子テーマのCSSファイルに以下を追記ではいかがかと。
@media screen and (max-width: 1023px) { .navi-in > .menu-mobile { overflow-x: visible; white-space: normal; justify-content: center; flex-wrap: wrap; } } @media screen and (max-width: 834px) { #navi .navi-in > .menu-mobile li { width: 50%; height: 40px; line-height: 40px; } }
ちょっと適当なので、どこか間違っているかもしれません。
Topic starter
2022年7月8日 01:17
ご返信をありがとうございます。
コードをご提示いただき、大変ありがたく思います‼︎
浅学で申し訳ないのですが、既存のグローバルメニューのコードを消したりはせず、追加して大丈夫でしょうか。
ぜひ追加させていただこうと思います。
2022年7月8日 01:36
@saa さん
親テーマ、子テーマって何?
という場合は以下が参考になるかと思います。
Cocoonテーマをインストールする方法
https://wp-cocoon.com/theme-install/
[解決済] 親テーマと子テーマについてです。
Topic starter
2022年7月8日 01:37
ご教授いただいた通りに追加してみたところ、まさしく理想の形にすることができました!!
本当にありがとうございます。
夜分でしたが親切に教えてくださり、ありがとうございました。
また何かありましたら、ぜひよろしくお願いいたします。
Topic starter
2022年7月8日 01:47
リフィトリー様、chu-ya様
この度は、ご返信とご教授いただき、本当にありがとうございました!
無事解決することができました。
本当に感謝いたします。
暑くなりましたので、ご自愛ください。
この度は、ありがとうございました。
わいひら reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。