Move the categories filter to the top of the mobile view

  • Resolved alanfrys

    (@alanfrys)


    3 years, 6 months ago

    Hi! i need to move the lateral bar of the web site, to the top if i see the web on the mobile. i saw another similar post and tried this code in adittional css, but doesnt work.

    @media only screen and (max-width: 767px) {
    body.woocommerce .site-content {
        margin-bottom: 2em;
        display: flex;
        flex-direction: column;
    }
    body.woocommerce div#primary {
        order: 2;
    }
    body.woocommerce div#secondary-left {
        order: 1;
    }
}

    How can i fix it? Thank you!

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Kaira

    (@kaira)

    Hi @alanfrys

    That will be because your theme has different class names and CSS.

    Try this and see if that works.

    @media only screen and (max-width: 921px) {
    body.woocommerce div#secondary {
        order: 1;
        padding: 20px 0 0;
    }
}
    Thread Starter alanfrys

    (@alanfrys)

    i tried that but doesnt work too, i use the astra theme (i dont know if this information is relevant)

    Another thing i think its the problem, my lateral bar its was created with WOOF plugin, so i gonna to ask them what the problem is.

    Thank you!

    Plugin Author Kaira

    (@kaira)

    Hi @alanfrys

    Ok, try this CSS and see if that works:

    @media only screen and (max-width: 921px) {
    body.woocommerce.ast-left-sidebar #content > .ast-container {
        flex-direction: column;
    }
}

    Maybe also go through the theme settings on the page, I imagine Astra would let you switch the mobile display order.

    Thanks
    Zack

    Thread Starter alanfrys

    (@alanfrys)

    @kaira you′re the best! its work′s perfect, thank you very much

    Taking advantage, do you know if it is possible that in the mobile version the sidebar is a drop-down list so it doesn’t take up so much space? To find out if, if possible, find out how to do it

    Again, thank you for the answer!

    Plugin Author Kaira

    (@kaira)

    Pleasure ??

    So those are created by the WOOF Products Filter plugin… I think they have the settings to make it a dropdown instead of checkboxes… But it’ll be best to ask the Woof plugin developers as I wouldn’t be able to help with that unfortunately.

    Thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Move the categories filter to the top of the mobile view’ is closed to new replies.