How to Hide and Remove Blogger Navigation Bar

Blogger Navigation Bar or Blogger Nav Bar is displayed by default at the top of every Blogger-powered blog. Unless you’re using a custom theme/template which automatically disabled, unless you manually remove blogger navigation bar (which is very irritating to our eyes!), you’ll never encounter any problem. But for some blogger users, Blogger Navigation bar still appears. Blogger navigation bar’s classic design cannot be modified and carries its default appearance which includes the Blogger Logo (which leads you back to blogger.com), a search box, the email address you used for logging in and other links you don’t even bother to know or click.

Blogger Navigation bar becomes unpleasant to our visitors because it contradicts the “feel”of our blogger themes/template. When I first encountered the Blogger navigation bar displayed at my newly created blog, I instantly removed it because it’s building eyesore to my visitors (especially me). Removing, Hiding and Disabling the blogger navigation bar is not prohibited by Blogger. It is widely accepted that removing the blogger navigation bar can be removed without any future penalty from Blogger.com.

Blogger navigation bar’s option to report any blog of abuse is one good reason why you should hide and remover Blogger Navigation bar! Ask yourself why.

Let’s Hide and Remove Blogger Navigation Bar!

Hiding and Removing blogger navigation bar requires no complicated algebra solution to arrive at unknown value of X. It’s very simple and requires only a few click of links and copy pasting a code on a specific portion of your blogger theme/template. Blogger Navigation bar can be remove by copy pasting the code below:

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

Before you end up editing and copy pasting the code for hiding and removing the Blogger Navigation bar, back up your template first.

Log in to your Blogger account to arrive at your dashboard, click Template under the More Options.

Now click on edit HTML then Save it anywhere.

Once backed up, you can now proceed on pasting the codes for hiding and removing the Blogger Navigation bar. Click on Edit HTML. Don’t forget to tick the Expand Widget Templates. Seeing the hundreds of thousands of codes (which you probably don’t want to touch), find the following code below (use CTRL + F) to find it in a jiffy.

]]></b:skin>

Insert/Paste the codes below right before ]]>.

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

You’re end result will be something like this one:

#navbar-iframe { height:0px; visibility:hidden; display:none; }
 
]]></b:skin>

I suppose you shouldn’t encounter any problem removing your blogger navigation bar? Once the codes are combined together, save your precious template and view if your Blogger Navigation bar is already hidden.

What do you think? Encountered errors or blogger template/theme while in the process of  hiding and removing the blogger navigation bar ? Let us know in the comments section below. Have a nice day!

Tweet

Nico Robin Salazar Nico Robin is a freelance blogger and college drop out student. He writes about anything that interests him. While being a college drop out student and an unemployed citizen of the Philippines, he makes his time worth while by doing volunteer works.