テーマ「chocolat」のサイドバーをスマートフォンではメインの下に、iPAD縦

  • 解決済 braincafe

    (@braincafe)


    8年、 8ヶ月前

    「chocolat」のテーマを使わせていただき、
    カスタマイズをしています。

    レスポンシブル対応ですので、
    スマートフォンの画面でサイドバーの部分がメインコンテンツの下に入るのはよいのですが、
    iPADくらいの画面の場合は、
    PCと同じようにサイドバーはメインコンテンツの右側に入るようにしたいのです。
    style.cssの該当しそうな「@media screen and (max-width: 600px)」の600pxの数字をいろいろ触っても変化がありません。
    どこで制御していらっしゃるのかお教えいただけないでしょうか。
    よろしくお願いいたします。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • Mizue Imai (Mignon Style)

    (@mignonstyle)

    8年、 7ヶ月前

    > braincafeさん

    『Chocolat』をお使いいただきありがとうございます。作者のMignon Styleです。

    ご質問の画面サイズによるサイドバーの位置の変更ですが、
    common.cssの533行目のあたりの「PC style 1000以上」というコメントの下、

    @media only screen and (min-width: 1000px) {
}

    こちらで制御しています。

    ただ、メディアクエリを変更すると他にも修正が必要な部分が出てくるかと思いますので、子テーマを作成して、デベロッパーツールなどで確認しながら作業していただいたほうがよいかと思います。
    お手数ですがよろしくお願いいたします。

    トピック投稿者 braincafe

    (@braincafe)

    8年、 7ヶ月前

    ありがとうございます。
    デバイスの幅でPCやipadやスマートフォンの横位置では
    PC版で
    スマートフォンの縦の場合のみ
    サイドバーがメインコンテンツの下に入るように
    いろいろ試してみたいと思います。

    お手数をお掛けしてすみませんでした。

    トピック投稿者 braincafe

    (@braincafe)

    8年、 7ヶ月前

    いろいろ調整してみて、iPADやスマホの横位置でサイドバーが右側に入るようになりました。
    ありがとうございます。
    あと、何度もこうし分けないのですが、
    ハンバーガーメニューだけではあまりクリックされないという記事がアップされたので、
    ハンバーガーメニューを横にMENUの文字を入れたものに変更したいのです。

    ハンバーガーメニューの設定はどこでされているのかをお教えいただけないでしょうか。

    何卒よろしくお願いいたします。

    モデレーター hide

    (@hideokamoto)

    8年、 7ヶ月前

    作業効率が10倍アップする Chrome Developer Tools の使い方 : https://dl.dropboxusercontent.com/u/148989/slide/console.html

    こちらを参考に一度探してみてはいかがでしょうか？

    トピック投稿者 braincafe

    (@braincafe)

    8年、 7ヶ月前

    いろいろありがとうございます。
    CSS内を探したところ、
    common.cssの nav-controlが関係しているんだなというところまではなんとなく判明。
    で、header.phpの
    <div id=”nav-control” class=”close”>
    <span class=”icon-menu”></span>
    </div>
    を
    <div id=”nav-control” class=”close”>
    <span class=”style1″>MENU</span></div>
    に修正して、</header>の上に
    .style1 {font-size: small}を追加したところ、
    三本線の変わりに「MENU」という文字が入りました。
    まずは、これで反応を見てみようと思います。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • トピック「テーマ「chocolat」のサイドバーをスマートフォンではメインの下に、iPAD縦」には新たに返信することはできません。

タグ