+91 989 64 00 986 blogginghub.in@gmail.com

Thursday, 20 June 2013

Best Methods To Remove or Hide Blogger Header Navbar Blog Trick

23:19

Share it Please
Whats Navigation Bar ?
Blogger’s default static templates have a Navigation bar also known as Nav bar on the top of header. This navigation bar have some instant options for Blog Administrators like going directly to Dashboard etc.
Sometimes it is necessary to remove this navigation bar. You may want to remove it for having more space, or you may want to give your Blogger Template a Professional look as it is a static website (Portfolio Website)…There may also some other reasons. This guide provides you full tutorial to remove or hide Blogger’s navigation bar.
A Spacial Method of Remove Naviation Bar from Google Blog Use A Premium Theme Or Free Template  

First of all, please note that i don’t know about Google’s policies for navigation bar, that one blogger should must have it or not. So this guide is only for information purposes. I am not suggesting you to remove Navbar, remove or hide it at your own risk. Beacuse its not cover in google Policy .
               Now lets go in some technical details. If you want to remove Blogger navbar then there are basically methods (that i knows) which can do the job in very less time and are very simple to follow. Most of the times, Blogger navigation bar comes in Blogger’s default templates. So in this example i am using ‘Simple Blogger Template’ designed by ‘Josh Peterson’.

Remove or Hide Navbar Process 1 :
               In this method we basically look for a CSS code of Navbar and then insert a little CSS code in that code which will hide Navigation bar. This method may not work for all templates. So let’s start the procedure:
  • Go to your Blogger Dashboard.
  • Click on your Blog Title.
  • Now go to Template section->Edit HTML.
  • Click on Proceed. Check Expand Widget Template.
  • Now press Ctrl+F and find the following code:
]]>
  • And Just above that code paste the following code:
#navbar-iframe,#navbar { display: none;}
  • Now save your template and check the result.

0 comments:

Post a Comment