Hide Navbar

Add This To Del.icio.us Share on Facebook StumbleUpon This Add to Technorati Digg This

Many bloggers wants to remove/hide Navbar for several reasons. Main reason is that Navbar provides you a link for 'Next Blog'.
You never know that what would be the content of next blog. It may be something very wiered. Apart from content issue, it provides a distraction for your visitors also. Quite possible that a visitor will go to next blog and will not return to your blog for that session.

How to hide Navbar?

There may be several methods to do this. I will discuss here two of them.
Method 1
Step1:- Go to Layout - Edit HTML
Step2:- a text editor will appear with the html/xml content of layout. Paste below script just before </head> tag.

<style type='text/css'>
#navbar-iframe {
display: none;
}
</style>

Step3:- Save the template. Thats it. Navbar is gone!!!
Method 2
Step1:- Go to Layout - Edit HTML 
Step2:- a text editor will appear with the html/xml content of layout. Paste below script just after <b:skin> tag.

div.navbar {
opacity:0.0;
display:none;
}
 
Step3:- Save the template. Thats it. Navbar is gone!!!
 
What you have lost in the process of hiding Navbar?

Navbar provides you two important functionality. Search and Dashboard. Since you have removed Navbar appearance, these functionality have been lost also.
 
But you don't worry. There is a work-around for it. We will create/add two gadgets for our blog, which will serve searching and link to Dashboard (I will call it admin link).

Follow these links for:-
Creation of Admin Link
Search Gadget for your Blog

For Further Reading,

Navbar