How to Hide Blogger NavBar (Top Navigation Bar)

Are you one of those with the new blogger beta? Still searching how to hide the blogger navbar? You known its a cross to bear for your visitors. Well, let me tell you that the new beta blogger uses different CSS tags. So your old CSS code fundas won’t work. Get this trick done by the following method.

The navbar or what you call the Navigation Bar or Banner appears on the top of the blogs. Typically the navbar includes the Search blog textbox, the next Blog link to switch to another blog, Flag blog to notify the objectionable contents and the sign in or create-blog link.

Hiding the navbar is as simple as it was earlier.  Just a change little change with the CSS code and you don’t see the nav bar again. How? Let’s see

Open the in your Blogger template. Type in the following lines within <style> tags.

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

In case you are using the Classic beta template inside new Blogger beta the trick is simple.
First search for the code #b-navbar and replace it with #navbar-iframe {display:none}.

How Can You Remove The Gap at the Top

Now that your Navbar is removed a gap appears in the portion, revealing the background color. In order to remove the gap follow this

Search near the top of the HTML, to find the code

body {

Add the code below after the body tag

position: relative;
top: -32px;

Don’t forget to save the changes you have made to the template.

Rest assured, the trick will not interfere with your custom layout designed by the webmaster.