How to Hide the Blogger Navigation Bar

I don't know about you, but the Blogger/Blogspot navigation bar is kind of an annoyance more than a help. I know that it does have some uses as far as being able to get to my dashboard quickly to write new posts,(that's why I have a separate shortcut for it) but I think any site looks better without it. That's why I'm going to show you today how to remove this little annoyance of the Blogger navigation bar (or at lease hide it).

First things first: I know you can't easily remove the navigation bar. It is something that Blogger has put in here for ease of use. I want my site to not look like its hosted by Blogger, and this is the primary reason for hiding the nav bar from the top of the page.
The first thing you need to do before attempting this is to backup your template. Yes, we are going to modify your blog's html template yet again. For a refresher on how to do this, see this post.
Once your template is backed up, scroll down in the code and look for:


/* Variable definitions

This is found at the top section of your template code. Once this is found, add the following code just above it:

#navbar-iframe { display: none ! important; } //turn off nav bar

This code hides the nav bar from the top of your Blogger site. If you want to see it again, but don't want to delete the above code, just put // in front of the above code.

If this doesn't work for you, please let me know and I'll find out what's going on.