Archived topic
Reordering a hook for mobile.
3 replies · Started by Craig on March 17, 2022
Hi
I am using a filter plugin to create filters. I have created a hook to house the filters and display them in the left sidebar. generate_before_left_sidebar_content. The filters are in a div - class="product-filter"
On a desktop, this works great and the filters display in the left sidebar.
On a mobile, the filter drops below the products and when scrolling up, the div scrolls on top of the menu.
How do I
1/ Get the div on a Mobile to display under the menu and above the products?
2/ When scrolling up, get the div to scroll under the menu?
Your help is always valued and appreciated.
Hi Craig,
1. Add this CSS:
@media (max-width: 768px) {
#left-sidebar {
order: -1;
}
}2. Add this CSS:
#left-sidebar {
position: relative;
z-index: 1;
}Adding CSS: https://docs.generatepress.com/article/adding-css/
Thank you Ying. Both work. Thanks So much
You are welcome :)
