When viewing my website in mobile view, is there a way to show the "Shop by" category first before showing the individual items?

Also I want the shop by category options to be shown without having to click the "+" sign.

I want to have the customer choose the "year, make, model, door, etc" first before showing them the default product items.

  • Anyone? Thank you Jul 22, 2016 at 6:48

1 Answer 1


I see that you use Bootstrap to make the site responsive. In Bootstrap it's very easy to re-order divs on mobile view. Just add classes col-xs-pull-12 to the Layered Nav div, and col-xs-push-12 to the content div. See this fine article for more information.

To show the categories without having to click the Plus sign just overwrite the CSS for it:

.sidebar .block .block-content {display: block}

If you only want this on mobile view, also take the mediaquery in CSS

@media only screen and (max-width: 767px) {
    .sidebar .block .block-content {display: block}

This would open all the blocks, if you only want the first you can add the .first class to the CSS selector.

This way your visitors will see the sidebar first, before the content. If you really only want to show the content after choices have been made, I suggest you open another question for that, because that's a whole different ballgame to do correctly.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.