Changing Sidebar order on mobile

This topic has 7 replies, 4 voices, and was last updated 6 years, 2 months ago by Tom.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts
June 4, 2015 at 12:09 am #112361

James Frost

I’m wanting to change the order in which the sidebars appear when viewing the site on a small screene. At the moment, the left sidebar is showing first, followed by the right sidebar. Can these be switched around so the right sidebar shows first?

thanks in advance,

James

June 4, 2015 at 12:14 am #112362

Tom
Lead Developer
Lead Developer

Had another user request this the other day.

Off to bed right now (12AM), but will look into this tomorrow. There should be something I can do.

Thanks! 🙂

June 4, 2015 at 1:08 pm #112503
Tom
Lead Developer
Lead Developer
Ok, best way to do this is to use jQuery.

Paste this into the wp_footer hook using GP Hooks, or enqueue it as a .js file:
```
<script>
jQuery(window).load(function($) {
	var mobile, widthTimer, leftSidebar, rightSidebar;
	mobile = jQuery( '.menu-toggle' );
	leftSidebar = jQuery( '#left-sidebar' );
	rightSidebar = jQuery( '#right-sidebar' );
			
	function generateRearrangeSidebars() {
		
		if ( leftSidebar.is( ':visible' ) && leftSidebar.is( ':visible' ) ) {
	
			if ( mobile.is( ':visible' ) ) {
				rightSidebar.insertAfter('#primary');
			} else {
				rightSidebar.insertAfter('#left-sidebar');
			}
		
		}
	}
			
	if ( mobile.is( ':visible' ) ) {
		generateRearrangeSidebars();
	}
			
	jQuery(window).resize(function() {
		clearTimeout(widthTimer);
		widthTimer = setTimeout(generateRearrangeSidebars, 100);
	});
});
</script>
```
June 4, 2015 at 1:51 pm #112527

James Frost

Tom,

fantastic – thanks for the quick response, that’s perfect.

Loving this theme.

Best regards

James

June 4, 2015 at 11:59 pm #112590

Tom
Lead Developer
Lead Developer

Perfect, happy to help 🙂

February 9, 2018 at 9:45 pm #492709

Bruno

Mmm, this post is from 2015…now 2018!

Tom, there MUST be a wisywyg way to do this?

Trying in customizer but they don’t hold their positions…

Thanks,
Bruno

February 10, 2018 at 3:32 am #492801

David
Staff
Customer Support

Something like this maybe:

https://generatepress.com/forums/topic/change-order-on-mobile/#post-157121

February 10, 2018 at 9:43 am #493047

Tom
Lead Developer
Lead Developer

Yea, Flexbox is definitely the way to go now 🙂
Author

Posts

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

[Resolved] Changing Sidebar order on mobile

Popular Articles

Start building better websites today.