Contents
スマホでサイドバーが出ない！？初心者がCocoonで解決した方法
ブログを作ってスマホで確認してみたら、 「えっ、サイドバー消えてる…どこ行った？」と焦った経験ありませんか？🥹 私もCocoonでブログを作り始めたばかりの頃、 パソコンではちゃんと表示されてたサイドバーが、 スマホではまるっと消えてることにびっくり！ 今回は、そんな初心者の私が実際にやってみて解決できた方法を、 同じことで困ってる方のためにまとめました🌿なぜスマホでサイドバーが消えるの？
結論から言うと、Cocoonの初期設定では「スマホではサイドバーを非表示にする」仕様になってるからです！ 「壊れた！？」「CSSミス！？」と疑っても、実は仕様通りの動きなんです。 でも、ちゃんと表示したい人のために、簡単な設定変更で出せる方法があります✨スマホでサイドバーを表示させる3ステップ
【ステップ1】「カスタマイズ」→「全体レイアウト」設定を確認
- WordPress管理画面の「外観」→「カスタマイズ」を開く
- 「全体レイアウト」へ進む
- 「モバイル表示時のサイドバー」の設定を確認 → 「表示しない」になっていたら「表示する」に変更！
【ステップ2】「スマホ開閉ボタン」の設定もチェック
サイドバーを右上メニュー（≡）で開ける仕様にしたい人は、- 「Cocoon設定」→「モバイル」タブを開く
- 「サイドメニュー開閉ボタンを表示する」にチェックを入れる
【ステップ3】ウィジェットで「表示場所」も確認
そもそもサイドバーに何もウィジェットが入っていないと、当然表示されません。 「外観」→「ウィジェット」で、 「サイドバー」エリアに何かウィジェットが入ってるかを確認してみてください。私がハマった落とし穴
- CSSで表示調整しようとしても!importantでも効かなかった（そもそも非表示設定だった💦）
- キャッシュが原因で変化が反映されないこともあった（→ 一度キャッシュ削除！）
- iPhone実機で確認するのが一番早かった！（PCだけだと気づかないこと多い）
まとめ：初心者こそ「スマホ表示」を大切に
- スマホでの見え方は、ブログ読者の8割以上に影響します
- Cocoonは便利だけど、初期設定に注意が必要
- 「困った経験＝財産！」ブログに書いて誰かの役に立とう✨
コメント