-
AuthorPosts
-
July 12, 2016 at 11:57 pm #660156
Hey there Kriesi!
We are using the sidebar widgets for our left hand navigation menu. I have been trying to see how to have this left hand navigation ‘sidebar pages’ widget minimize the same way the top menu shrinks when in mobile view.
Please see link below to a few sample pages containing this ‘sidebar pages’ widget and how it looks when minimized. We wanted to avoid having the entire menu as the first thing you view when you’re on a mobile device. Is there a CSS that can be added that will have this ‘sidebar pages’ widget minimize after a certain screensize?Thank you!!!!!!!!!
July 15, 2016 at 4:25 am #661121Hey tlchase!
Thank you for using Enfold.
Looks like the widget area is being used in place of the sidebar. The default sidebar should go to the bottom of the page on mobile view. We can use jQuery to reverse the order of the column on mobile view. Example: https://kriesi.at/support/topic/remove-border-from-partner-logo-list/#post-586602
Please turn on a custom css class. Edit the columns then add a unique class attribute to them.
Best regards,
IsmaelJuly 19, 2016 at 8:16 pm #662701Thank you Ismael, I was reviewing the post example and response but that would mean that I would have to update each column where the sidebar pages widget resides, correct? We have 260+ pages on our site, is there any other way to have all sidebar pages widget appear at the bottom in mobile view? Or perhaps more ideally, if this sidebar pages widget could be minimized since the widget is referencing an actual enfold menu?
Any other options or ideas would be greatly appreciated. Thank you!
July 23, 2016 at 5:26 am #664122Hi,
Do you have the same menu widget on every page? This snippet might work:
// custom script add_action('wp_footer', 'add_custom_script'); function add_custom_script(){ ?> <script> (function($){ function a() { var isMobile = ''; if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) && 'ontouchstart' in document.documentElement) { isMobile = true; } else { isMobile = false; } if( isMobile ) { var sidebar = $('.menu-irb-container').parents('.flex_column'); sidebar.next().insertBefore(sidebar); } } a(); })(jQuery); </script> <?php } add_action('wp_footer', 'add_custom_script');
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.