How to Hide Blogger Navbar in New Blogger Beta

Want to get rid of the blogger toolbar in new blogger that just came out of beta ?


If you have shifted your blogspot blog from old blogger to the new blogger beta, you may have noticed that the previous CSS code to remove the blogger navbar will no longer be effective. That's because Google now uses different CSS tags to display the blogger bar. [#navbar-iframe instead of #b-navbar]

Fortunately, hiding the blogger navbar from new blogger is also as simple as the old one. Just add the following lines anywhere in your Blogger template [enclosed by <style> tags] and the blogger banner will be gone forever.

       #navbar-iframe {
              height:0px;
              visibility:hidden;
              display:none;
        }

Alternatively, if you are using the Classic beta template inside new Blogger beta, search and replace #b-navbar with #navbar-iframe to get rid of the blogger navbar.

While the above beta blogger hack works perfect, here are some alternate solutions for hiding the navbar by bloggers Praveen and Aditya. You may try the following navbar hacks if the previous one isn't working for some reason:

/* By Apnerve http://www.apnerve.blogspot.com
----------------------------------------------- */
#navbar #Navbar1 iframe {
 display:none;
 visibility:none;
}

/* By Aditya http://the-lastword.blogspot.com/
----------------------------------------------- */
div.navbar {
 opacity:0.0;
 display:none;
}

Should you hide the navbar ? Will it break any blogger TOS ?

The old blogger as well as beta blogger's policy page do not mention anything about removing the blogger navigation toolbar. Infact, the old blogger TOS page still makes references to Pyra when Google is the owner.

Similarly many blogger users have raised a similar issue in the Blogger google groups but again, there has been no real consensus.