PRO - Left sidebar on Shop and Shop Cats. Pages migrates to bottom of the page instead of top on mobile

[taotaoli]

Hi friends,
I’ve got my site set up at http://smartechproduct.com/products and we have an issue where the sidebar used to sort the products drops down below the content when viewed on smaller screens. We’d like it to be on the top. Better yet, we’d like a mobile sorting sidebar that would be visible only on small screens and a second sidebar visible for desktop and laptop screens. We’d like this functionality on the shop page and all of the product category pages. Thank you for your attention.
Best wishes,
Andy

[rad]

Hi there,

Thanks for writing in.

This is only possible in custom development since it’s also related to a 3rd party plugin. I recommend contacting the plugin author or a developer for device-specific implementation.

Thanks!

[taotaoli]

Dear @Rad,
I believe this issue is related to styling of the content and the side bar and making the sidebar appear before the content using @media rules. Do you believe this to be a situation where I’d need to modify the_page template or functions.php? I’d greatly appreciate some more advice.
Much obliged,
Andy

[ruenel]

Hey Andy,

maybe we are not on the same page. We have checked your site and there is no sidebar. Did you happened to removed it and made your global content layout as Fullwidth? When you select a content layout with a sidebar, on mobile screens, it will collapse and always displays at the bottom. If you want that it would display before the main content, please add this JS code in the Theme Options > Global JS (http://prntscr.com/evswzb)

(function($){
  $('.x-sidebar').insertBefore( $('.x-main') );
})(jQuery);

Hope this helps. Please let us know how it goes.

[taotaoli]

Dear @RueNel
We’ve put that on the back-burner and will revisit soon. Thank you for your help. I’m so grateful for your team’s product and customer service. It has cut down development time immensely. I can’t overstate how thankful I am.
Best wishes,
Andy

[thai]

If you need anything else please let us know.