This code removes all widgets from the sidebar on mobiles except the first widget which is shown before the content like this :
Video Demo
The video shows 3 widgets in the primary sidebar on desktop and only the first widget displaying on mobile.
It doesn’t matter how many widgets are added in the primary sidebar as the code only shows the 1st widget once the screen width reduces below 1023px or any other width you set in the media queries.
Here’s the code for members:
Related Tutorials
- Reorder Widget Areas on Mobile
- Change Order of Sidebar Widgets On Mobiles
- Sidebar Before Content On Smaller Screens
- Reposition Header Elements Based On Screen Width
Was this helpful?
Thanks for your feedback!


Leave a Reply