The steps are straightforward and would hardly soak 10 minutes to complete so just do as follows.
- 1. Go to Blogger.com >> Add NEW Page/Post
- 2. Now select HTML TAB on Blogger Post Editor
- 3. Paste the following CSS and XML Code:
<style>
#sidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer { display:none !important;} #main-wrapper { width:98%!important;} .post { width:98%!important; }
</style>
- 4. Replace width:98% according to your needs, you can even uses pixels instead of percentage i.e. 960px.
Additional Tips: If you want to exclude Titles from a certain page, then just paste the following code before </style> in above coding. Bots and crawlers will continue to fetch your Title, but human visitors will not view them because with the help of CSS we have concealed them.
.post-title, .post-labels, post-icons, post-author {display:none!important;}
- 5. Now Publish it and then visit your site to witness a perfect full width page without sidebar.
How Does the Whole Process Works:
Now after successfully increasing the width of your page, you would be curious to learn how the whole process works. Fundamentally, there is no magic behind it because the whole credit goes to Style sheet (CSS). If you have noticed in above CSS, we have used {display:none !important;} which is responsible for hiding the sidebar and etc. Moreover, you can even use display:none to hide any widget from any page or post but make sure you attach proper CLASS Ids to complete the process.
Where and Why You Should Use Full Width in Pages?
Before we could jump onto our tutorial, let us first quickly rap up, where we can utilize the full-width pages. Now you may have seen those WordPress websites which uses stretched in size, whenever they want to add an Infographics to their posts. In that same way, you can either use them in about us or advertise here pages, so that you can gain maximum attraction out of your every visitor.
From The Editor’s Desk:
If you have noticed, we have also customized our 404 Page to Full-width and soon will be revealing its secret. Our developers are busy to create some marvelous widgets for blogger that will be released once the work got finalized. Alhamdulillah we have achieved more than 2000 fans on Facebook, while more than 4000 twitter followers and the number is rapidly multiplying.
Special thanks to Mustafa Ahmed Zai for helping us. From the beginning, he has been our mentor and continues to help us whenever it is required. If have any difficulties during this tutorial then don’t hesitate to drop your comments. Till then peace blessings and happy stretching.
How To Create a Full Width Page and Remove Sidebar in Blogger
4/
5
By
Editorial Board
Dear Reader! We’re enthusiastic to see your comment but after reading the Content please ask for advice and to provide constructive feedback Please Write Relevant Comment with Polite Language.Your comments inspired me to continue blogging. Your opinion much more valuable to me.
Let’s enjoy a personal and evocative conversation. Thank You!