New Landing How can we help? Atelier Woocommerce sidebar issues on mobile

Viewing 7 posts - 1 through 7 (of 7 total)
  • Posted in: Atelier
  • #305685
    GTS75
    Member
    Post count: 240

    I’m using a sidebar menu on my woocommerce category pages and it looks great on desktop, but when it’s displayed on a phone it’s shown down below all of the page content and it’s crushed against one side of the screen, definitely not optimized for mobile. Is it possible to have the menu display normally on phones? Or can I limit the sidebar menu to only display on desktops?

    Thanks

    Attachments:
    You must be logged in to view attached files.
    #305719
    David Martin – Support
    Moderator
    Post count: 20834

    This is caused by your custom CSS:

    aside.sidebar.col-sm-3 {
        width: 20%;
    }

    You will want to handle that for mobile also, so this example will help you:

    @media only screen and (max-width: 767px) {
    aside.sidebar.col-sm-3 {
        width: 100% !important;
    }
    }
    #305795
    GTS75
    Member
    Post count: 240

    I added that 2nd code and nothing changed. Does that 2nd code replace the initial code I had in there?

    #305796
    GTS75
    Member
    Post count: 240

    I added that 2nd code and nothing changed. Does that 2nd code replace the initial code I had in there?

    Is it possible to not display the woocommerce sidebar menus on mobile?

    #305797
    David Martin – Support
    Moderator
    Post count: 20834

    No it’s not to replace, it’s to go with it.

    It will make the sidebar fullwidth again on mobile, overriding the initial custom css you have.

    #305801
    GTS75
    Member
    Post count: 240

    great, thank you.

    #305803
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    No problem. Thanks David.

    -Rui

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register