Remove and Hide Blogger NavBar (Top Navigation Bar)

STEP1:Log in to Blogger, go to "Layout" -> "Edit HTML"Now find this code:

]]>

Note:

there will be two ]]> PASTE THE BELOW GIVEN CODE AFTER 2ND ]]>

STEP2:And immediately BEFORE/ABOVE it, paste this 

code:

#navbar { display: none; }

or:

#navbar-iframe { display: none !important; }

Now click on Save Template

and you will see that now there is no blogger Navigation bar on your blog 

Remove and Hide NavBar in Blogger Classic Template

1. Login to Blogger.
2. On the Blogger Dashboard, click on the Template link of the blog that you want to disable its NavBar. You can also click Customize on NavBar while visiting your blog.
   
   
   
   
   
   
   
   
   
   
   
   
3. The Edit HTML page under Template tab should be loaded. If not, go to the tab.
4. Search for the following line of code:
   Then, add the following line of code before that line:
   #navbar-iframe { display: none; }
   The Blogger Classic Template uses iframe to load the NavBar, and styles it with ID named navbar-iframe. The name actually also works for new Blogger Widget Template too.
5. After hiding the Nav Bar in Blogger using Classic Template, there tends to be a gap that replaces the navigation bar. The gap may be white, red, green, blue, or black in color, depends on what is your background color. To remove the gap, find the following code (normally near the top of the HTML):
   body {
   Add in the following like of code after the body tag:
   position: relative;
top: -32px;
6. Click on SAVE TEMPLATE CHANGES button when done.

Tip: To display and show NavBar again, just remove and delete the additional codes that have been added.