Suggestion: “Swap Content and Sidebar” applying to mobile

Hello,

Sorry! We missed your support request!

With this theme, on mobile (under 768px wide) the block sidebar is displayed below the content. Do you mean you’d like it displayed above the content or do you mean that you’d like to see the sidebar to the left of the content on smaller screens?

Thanks,

Oliver

Sidebar displayed above content.
I know I can do this with some Child theme action and manual coding but thought I’d ask.

Hi,

Please try adding this CSS into “Customizer – Additional CSS” …

@media screen and (max-width: 48em) {
	.has-sidebar #content>.wrap {
		display: flex;
		flex-direction: column-reverse
	}
}

Let me know if that works and I’ll add it as an option.

Oliver

Is it possible to apply this code to other themes? I want to achieve the same thing as machinelf switching the content and the sidebar widgets for mobile devices. I tried to use the code above, but nothing changes. The page it concerns is the blog page https://adt-infinitum.nl/de-catalogus/. Thanks in advance.

Sure, so the code above will only work for Twenty Seventeen theme. Your theme is Rife Free and this CSS should accomplish the same effect for that theme …

@media only screen and (max-width: 768px) {
.with-sidebar #col-mask {
display: flex;
flex-direction: column-reverse;
}
}

Oliver

Sorry for the delay answering, as I didn’t think was possible. Alas, it is!
Yes, Oliver that works! Thank you so much! How easy this was!
My use case was this: I have a music site and have a Youtube playlist in the sidebar. People like to go to my site and see what’s new in music. Now we are perfect!

• This reply was modified 2 years, 5 months ago by machinelf.

Oh that’s great. Glad it worked. I’ll add it as an option in the plugin.

Oliver