Easily Remove Your Sidebar Widget On Your Blog Mobile View

I love my blog simple and easily to get access to. Any distraction should be removed so my readers can get the best out of onenaijablog or what do you think?

A while back, a friend asked me how I made the sidebar on my blog mobile view disappear but shows on my desktop view. And I asked him, would you like that on your blog? And he replied, yes.

Must Read: Clean Your Blog And Attract Search Engine Using These Methods

So on our today’s post; we will be discussing how to hide our sidebar on our blog’s mobile view.

Reason you might want this on your blog

Have you ever tried scrolling down a blog using your mobile phone? How stressful is it before you see the footer of the blog you’re scrolling?

Tell me, do readers who surf your blog using their mobile phones actually have the time to check your blog widgets? If I don’t have the time, many readers certainly don’t as well.

You can help your mobile readers save internet data by hiding your sidebar widget on mobile visitors 😉

Easily Remove Your Sidebar Widget On Your Blog’s Mobile View

You can relieve the stress of your readers and improve the speed of your blog by removing the sidebar widget on your mobile view.

We are going to do this tutorial in 3 working steps…

Note: before you carry out any of the steps, please make sure you do a backup of your file. So you can revert when you make a mistake.

First step #1

This step is for the Genesis themes and non-Genesis theme users…

Must Read: A Non Techie Guide on How To Improve The Speed Of Your Blog

Go to your blog dashboard >>> click “Appearance” >>> click “Editor” and add the below code to your CSS.

[code]@media screen and (max-width: 480px) {

body:not(.home) #content .sidebar-primary {

display: none;

}

}[/code]

By using the above CSS code, it will help you hide your sidebar widget on any 480px screens and below.

First step #2

If you are a non-Genesis user, you can start by go to your blog dashboard >>> click “Appearance” >>> click “Editor” and navigate to your “sidebar.php”

Note: at your end, it might be “sidebar-single.php, sidebar-blog.php, sidebar-archive.php” depending on the theme structure.

Now find the line 8, and add “visible-desktop” to the Secondary Class session… You can take a look at the example below

[code]<div id="secondary" class="widget-area span3 visible-desktop" role="complementary">[/code]

After you have added the line, click “Update File” and you are done

First step #3

If you are afraid of playing with codes, you can use a plugin to ease your stress.

There are enough plugins that can help you out with hiding your sidebar widget… but one of the plugins I’ll recommend you use is “Widget Option” and you can download it using this link.

Widget Option allows you to easily hide all widgets or any widget you feel like hiding either on your desktop or your mobile view.

Conclusion

If you are searching for a way to hide your sidebar widget on mobile, now here’s a complete guide for you.

Back to you

Looks like I have said so much about so much on how to hide your sidebar widget on your blog’s mobile views, now it’s time to pass the keyboard to you guys.

Must Read: Got A Blog But Haven’t Made A Dime From It? Here’s What To Do

Do you have comments, questions, or thoughts you’d love to share with us? Please do by using the comment box below.

Remember that your comments, questions, and thoughts are highly welcomed and most appreciated.

Be social

Do share this post with your blogging friends and groups. I am sure they will find the post useful and resourceful enough to thank you.

Do not forget to subscribe to our feed for your latest and most fresh content on the go.