|Adjust Space B/W Main Body And Sidebar
No one would prefer to stay on those simple and not properly SEO optimized templates provided on blogspot. It’s a natural thing once we’ve started receiving readers we want to improve the layout of our template to make them feel better. At that time we would move to a custom template.
Now the problem would occur once you’ve implemented any third-party theme. Most probably Template designer option would be disabled for you. You can’t make changes using it. The only option left is template’s html code. If you’re very much familiar with HTML and css then it’s a child play for you but I am writing this guide for those who’ve a little bit idea about coding skills.
This guide is on how to remove the unwanted space between your blog posts body and the sidebar. Currently I am using responsive template on this blog but on mobile view the sidebar was looking a little shifted towards right side. So I started to find out the fix for this and after a deep study of 1 hour I fixed this error on my blog.
I have found two methods to increase or decrease gap between post body and your sidebar. You can check them out below.
See also : [Tutorial] How to Add Old Menu Bar in Google Chrome
Method 1: –
- Navigate to Blogger>>Template>>Edit HTML.
- Press ctrl+F to open search window.
- Now search for this code ]]></b:skin>.
- Place the following code either below or above ]]></b:skin>.
- Alternatively you can paste it in CSS menu too simply navigate to Layout>>Template Designer>>Advanced and paste the above code there. Press enter and click on Apply to blog.
- You can adjust -18px to decrease or increase spacing between main body and sidebar.
Method 2: –
If the above solution doesn’t work for you then simply give a try to this method. Frankly saying above method didn’t work for me rather this one gave output. But is it not so that it won’t work for everyone.
- First of all don’t forget to take backup of your template. You can easily backup your template, simply navigate to Template section and click on Backup/Restore>>Download full template. (This would save you from any accidental damage)
- Now go to Template then press Edit HTML.
- Press ctrl+F and search for “sidebar-wrapper”. You’ll notice many but remember to choose only that one which is having margin-left: 0px;
- Now just adjust 0px; according to your need. As you can notice I have given it 0 while previously it was 20.
- Once you’re done click on Save Template to save your work.
So this was all about on removing gap between posts body and sidebar. Let me know if you’re still facing this issue. Feel free to leave a comment below in the comment section for any query, doubt or another method for this problem.
He is a Tech Geek, Gadget Expert, SEO Expert, Web Designer, and a Blogger. Having a technology background gives him a unique perspective!