Friday, March 26, 2010

How to Remove and Hide Blogger NavBar (Top Navigation Bar)

I find this Navigation bar on top of the blog useless for me and readers of the blog.

Unfortunately it’s not possible to hide this NavBar using blogger settings.   But you can do this manually editing Html of the page and adding needed CSS class there.  Here are the instructions:

  • Login to Blogger.
  • On the Blogger Dashboard, click on the Layout link of the blog.

    image

  • The Edit HTML page under Layout tab should be loaded. If not, go to the tab.
  • Search for the following line of code:

    </style>

    Then, add the following line of code before that line:

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

    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.

  • No comments: