How to remove or restore Blogger navbar

If you are using Blogger default template, you may notice the dark blue bar on top of your blog, that’s the navigation bar or navbar in short. Actually it’s pretty useful, you can use it to sign in to your blogger account, to create a new post, share and customize your blog. You can also search for blogs, and flag or follow the blog you are viewing.

Why do people want to remove or hide it then? Well for one, the bar is not visually appealing, it’s not the prettiest of bars (despite being pretty useful). Secondly, there’s a chance your visitors might leave your blog when they click Search Blog and Next Blog links.

(If you would rather not hide the navbar completely, try Navbar peekaboo)

Okay enough with the customary intro, let’s proceed.

 

Remove navbar

1. Login to your to your Blogger account.
2. Go to Dashboard > Design > Edit HTML.
3. Back up your template.
4. Look for ]]></b:skin> inside the code window. Add the code below right before that line:

   /* Hide Navigation Bar */
   #navbar { height: 0px; visibility: hidden; display: none; }
   /* www.BloggerSentral.com */

   if you are using Blogger classic template, replace #navbar with #navbar-iframe.
5. Click Preview. If the bar is gone then click Save Template button.
6. That’s all, done!

For those who sign-in using the navbar, now that it’s gone (hidden actually), you might wonder how do you sign in after this? Answer, just go to Blogger.com, sign-in from there, if you’ve already signed in it will transfer you direct to Dashboard.

 

Restore navbar

If your template doesn’t come with the navbar in the first place, and you want it restored, just search (use Ctrl+F) for #navbar or #navbar-iframe in your template code. You should find similar code with the one in step 4.

To get your navbar back, just delete the code.

Technorati Tags: blogger navbar