How to Remove the Blogger Navigation Bar

The Blogger navigation bar.

Why keep it? It helps make editing your Blogger posts a little easier and you may get a little traffic from the “next blog” link. But without it, it gives your blog a more professional look, it frees up unnecessary distraction and it adds a little more space to the top of your blog.

If you’re like me and want to remove it, that is easy to do:

  1. First sign into your Blogger account.
  2. Then click on the “Template Designer” link in the “Design” tab or if you are in the new Blogger interface, click “Customize” to access the Template Designer.
  3. Then once you’re in the Template Designer, click on the “Advanced” link in the left menu.
  4. Finally scroll down to the link that says “Add CSS” and then in that section add this code to remove your navigation bar:

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

It should look like this:

If you later decide that you miss having the navigation bar on your blog, you can simply remove this code from the HTML and the navigation bar should show up once again. In your Blogger HTML, search for “#navbar-iframe” with ctrl + f or command + f and once you find it, just delete the same code listed above.

Comments

  1. Ahh Wat a relief.. i always saw other blogs and wondered where is the ugly bar That my blog has… Thank you so much for this post. I read it immediately removed the bar. Thank u once again..

    • You’re welcome! I’m so glad this tutorial was easy for you to follow and that it was helpful for you too.

  2. stacey says ·

    Yeah!!!! Thank you for this tutorial. I have wanted to remove the nav bar on a site I’m creating and couldn’t figure it out…. It looks far better without it.

Your email address will not be published. Required fields are marked *