Remove Blogger Navigation Bar

blogger-navbar,-blogger-nav Removing blogger navigation bar is as easy as drinking a cup of tea! Below I have shared a pretty easy way of getting rid of that annoying nav-bar. The blogger navbar is a default feature that appears at the top of every blogger hosted blog. There are many reasons why you should remove the blogger navbar, some of which are mentioned below,

  1. It makes your blog look less professional
  2. You can be flagged by anyone!
  3. It allows your readers to view other member blogs by clicking the “Next Blog” button, which may contain objectionable content like adult explicit content!

Now you would agree with me, why I called it annoying. Before you may remove or hide blogger navigation bar please ensure that you have made a backup of your template.

BACKUP YOUR BLOGGER TEMPLATE

As we are adding code directly to the Blogger template for this customization, it is necessary to make a back-up of the existing template code. If suppose you get an error while customizing your template or you delete or break a code accidently, you will be able to easily restore your template.

To make a back-up of your Blogger template, go to Layout>Edit HTML in your Blogger dashboard, and look for the “Download full template” link near the top of the page.

Clicking on this link will prompt you to save your existing template to your computer hard drive. Save it somewhere so that you could find it easily while restoring your template.

REMOVING BLOGGER NAVBAR

Simply do the following,

  1. Go to layout > Edit HTML in your blogger dashboard
  2. Copy the code below, [Press “Ctrl + C” to copy & “Ctrl + V” to paste a code]

 

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

    3.   Press Ctrl+F and search for Variable definitions

    3.   Paste the above code just before/above Variable definitions

remove-nav-bar

    4.    Save your template and enjoy the new look of your pro blog :)

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

20 comments

PLEASE NOTE:
We have Zero Tolerance to Spam. Chessy Comments and Comments with 'Links' will be deleted immediately upon our review.
  1. @Soresteps

    I am glad you got rid of blogger navbar :)

    ReplyDelete
  2. Ha198000

    Make sure you have pasted the code at the right location. Paste it just above variable definitions. If the code still didn't work use this one
    #navbar-iframe {
    display: none !important;
    }

    ReplyDelete
  3. Hi. Thanks for all the great info. and the cool tips. I´m just wondering how to access the configuration screen, if you want to make any changes to your blog, without having to click 'back' on the web browser.

    Thanks a lot.

    ReplyDelete
  4. Goviota, simply open new tabs for previewing changes made to your blog and leave the edit HTML tab intact.

    Though their is a more advance method by which you can create an administrator control panel in your blogger sidebar which will be visible to blog author alone. Search for it in google and you will land on several tutorials on how to create such a panel.

    But I would prefer the first method.

    ReplyDelete
  5. it is just recently that i knew that it’s possible to remove this navbar, my blogs were just bad and so, for long time. In my opinion it’s always a better option to remove the blogger navbar because when it’s not done, the blog just looks like a novice blog. Thanks so much for the trick! Wow! This tip will grow my traffic by 200%, many people really ignore this tip. I thank you so much guy!

    ReplyDelete
  6. thank's for this great idea.it work's great.!

    ReplyDelete
  7. so how to login..if the bar is mising?

    ReplyDelete
  8. Really great tip, but I don't know how to access the settings and statistics any more. Maybe you could help me! Thank you a lot! Your blog is wonderful!

    ReplyDelete
  9. in my blog it did not work, then i
    #navbar { height:0px; visibility:hidden; display:none }
    --------------in place of --------------
    #navbar-iframe { height:0px; visibility:hidden; display:none }

    and it worked for me !!!!!

    ReplyDelete
  10. Thank you for this! That navbar annoys me so much!! Now it's gone :D

    ReplyDelete
  11. If you are speaking of accessing the "design" tab found in the NAV bar, after selecting "design", simply bookmark it somewhere convenient before deleting the NAV bar. Afterward, if you need to get back into the "design" page, simply goto the bookmark for it. Hope that helps.

    ReplyDelete