How to Create Full Width Page and Hide Sidebar in Blogger

No doubt, Blogger is a one of the best blogging platform though it is not so flexible. Being a blogspot user we thought that hiding a certain element on our webpage is quite difficult task and cannot be done. But we must know that it all depends on CSS and XML and we can easily hide or remove a certain element with the help of a little css coding. So today we are going to learn how to hide sidebar in your blogger blog and create a full width page with no sidebar.

Check Out Demo Of Full Width Page

Removing Sidebar and Increase Width of Pages:

Just follow the below simple steps to hide sidebar in your certain blogger page or post :

1. Go to Blogger.com >> Add New Page/Post

2. Now select Edit HTML tab of Blogger Template.

3. Paste the following CSS :

<style>
#sidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer { display:none !important;} #main-wrapper { width:99%!important;} .post { width:99%!important; }
</style>

4. Replace width:99% according to your needs, you can even uses pixels instead of percentage i.e. 960px.

Additional Coding : If you also want to hide Titles from a certain page, then just paste the following code before </style> in above coding. ( it will not effect crawling as bots can easily see these things)

.post-title, .post-labels, post-icons, post-author {display:none!important;}

5. Now publish it and then visit your site to check your blog pages with perfect look.

This code hides the sidebar of your blog and gives a more professional look to your blog pages.
I hope you successfully publish your full width page/post. If you face any difficulty let me know in comments.