How to hide, remove or disable and restore Blogger navbar

Sorry for the long delay. I have not been able to update my blog frequently anymore as I have lots and lots and lots of freaking school stuffs to take care of. (You will DO know what I am talking about IF you keep up-to-date to this blog. So be sure to come back for more updates^^) Anyway, so here I am again posting great stuffs on my great blog for my GREAT audiences like YOU~ XD Muakssss.....

OK! During those few days of delays, I discovered an interesting knowledge specially for all bloggers on Blogspot from a website (not discovery channel FYI) that we, bloggers DO can remove our irritating navigation bar from our blog page so that that navbar will not spoil our whole blog's image. BUT.... the bad news is..... [drumroll.....]

the navbar isn't removed permanently but when we hover our mouse over the top, the navbar will reappear again. XD WOW! Amazing, isn't it?

Blogger Navbar

FOR MORE INFORMATION, please do not hesitate to try it out on my blog. HOW? You see, when you first log into this page, you will notice that my Navbar is missing!!! (as shown in the picture below)

BUT if you move your mouse to the top of the page, the navbar reappear again, MAGIC!!! XD

Ha! Now your mind is filled with question marks. Don't worry. LjOCH is here to the rescue! The following steps should get you started on a journey without "navbar" to guide you......

Step 1) Go to your blog's homepage. Click on 'DESIGN'........

Step 2) After clicking 'DESIGN', you will be directed to this page as shown below.

**Please back up your precious blog's template before you follow these steps to prevent any loss.

Then, click on 'TEMPLATE' --------> 'Edit HTML'. (keep scrolling......)

Step 3) Click on 'Expand Widget Templates', press Ctrl F and look for 'BODY{'

Copy and paste the codes below after 'BODY{'

#navbar-iframe {

opacity:0.0;

height: 10px;

filter:alpha(Opacity=0)

}

#navbar-iframe:hover {

opacity:1.0;height: 30px;

filter:alpha(Opacity=100, FinishedOpacity=100)

border: 2px;}

Step 4) Preview your blog to see if it works. Lastly, click 'Save template' and TAAADDAAAA.....

CONGRATS, you have successfully removed your blog's navbar! Have fun with your new blog^^ FYI, if you want to remove this function from your blog, just remove the code above. DONE!

Interesting knowledge you have gained today? Then, SHARE this out with all your friends through Facebook, Twitter, or any sorts of ways or maybe even share this by showing your friends. ALWAYS remember that "Sharing is Caring".

P/S: This tutorial is only for bloggers on Blogspot. :'(     But if this doesn't work for your blogspot, please post your doubts into the comment box below. TQ^^  God bless~

Do you like this post? Please link back to this article by copying one of the codes below. URL: http://loch2day.blogspot.com/2012/03/how-to-remove-and-restore-navbar-on.html HTML link code: <a href="http://loch2day.blogspot.com/2012/03/how-to-remove-and-restore-navbar-on.html">How to hide, remove or disable and restore Blogger navbar</a> BB (forum) link code: [url=http://loch2day.blogspot.com/2012/03/how-to-remove-and-restore-navbar-on.html]How to hide, remove or disable and restore Blogger navbar[/url]

Subscribe To Get FREE Tutorials!