How to Hide or Show Blogger Navbar
Some readers has emailed me asking how to re-show the Blogger Navbar on my released Blogger Templates. So I think I should write this post to figure it out.
Introduction
The Blogger Navbar is a navigation and search bar on top of all blogspot blogs. It is available in several colors, and is configured in the Template tab in Blogger’s interface. You can get more information about Navbar from Blogger here
The reason why I remove the Blogger navbar on EVERY Blogger Template is its mismatch color. Even though Blogger provide several useful features and different colours, it always not blend well with my templates. It’s an eye sore and makes my blog theme look less professional.
Show/Hide blogger navbar
Step 1. Log in to blogger account
Step 2. On your Dashboard, select Layout. This will take you to the Template tab. Click Edit HTML. Under the Edit Template section you will see you blog’s HTML.
Step 3. Delete the code below to show the Navbar
#navbar, #navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}
or Add that code to your css code to hide the Navbar.
That is all.
Twitter
Now.. I know why my blogger nav missing… hahaha.. didn’t know it can be hide… thanx as always…
hi,……i can’t see that code,…..so,what should i do?
If the above trick does not work use this.
Add this code before the body
<style type=”text/css”>#b-navbar { height:0px; visibility:hidden; display:none}</style>
The above code will remove the navbar but the navbar area will be blank. For fixing that use:
body { margin-top:15px; position: relative; top: -35px; }
Some where after the body and before your CSS data begins.
Thanks for nice info, that’s work.
Thanks brother..
Nice trick
Yes, very simple but useful
I found that some blogger template hide the navigation bar automatically ! without any hack or scripting stuff
I can’t find #navbar element in my blog template
In you case, the code is #navbar-iframe
Thank you SO much for this! I’ve been trying to figure out how to hide that annoying navbar since I joined Blogger. That was easier than I could have imagined – thank you, thank you!
Stupid question: Since that is how I would go about making new posts and customizing my blog, do I just go into the Google Dashboard now to get into the back end of my blog?
Thanks again – you are more than helpful! I stumbled this one.
this is my html, wad should i do to show navbar?
#b-navbar { height:0px; visibility:hidden; display:none }
#lynn2{ width: 800px;
font-family: lucida console;
padding: 5px;
font-size: 11px; }
#lynn{
width: 500px;
padding: 5px;
font-family: lucida console;
font-size: 11px; }
#lynn3{ width: 900px; }
#text{ writing-mode: tb-rl;
font-family: Lucida console;
font-size: 50px; }
#navbar-iframe{ display: none; }
I’ve seen certain blog sites where the blogger is giving the reader an option to “show/hide navigation bar”. I tried it and it works great great! Any ideas on how to do this?
i got it.. thank u sir for that great idea… now, i already hide my navbar… thankz a lot sir…
Thank you so much. This was driving me crazy till I found this article! So easy to fix. Thank you!
How do you get to the dashboard if the navbar is hidden?
Hey thanks for the information, it helps a lot
That was helpful