Wednesday, July 21, 2010

Kick Your Blog's Navbar

A lot of people who host their blogs on Blogger (just like me!) complain about the inability to remove the blogger navigation bar via their elements page. Indeed, if that's where you are looking, the only thing you'll be able to do from there is change the color to one of several pre-determined selections.

Today I am going to be little technical. If you really want to remove the blogger navigation bar, you need to access your HTML template. Before I tell you how to do that, however, I'd like to first talk about why you may or may not want to remove the nav bar from your blogspot blog.

Reasons to remove it

·         It looks more professional without it: Depending on what your purpose for blogging is, you may choose to remove the blogger navbar because having one makes a blog look more like a free-hosted blog and less like a professional site worth taking seriously.

·         It gives you more space at the top of your page: This may not seem significant, but not having the navbar there does give you a bit more space for graphics. I have found this space to be quite useful when designing my own blogs.

Reasons to keep it

·         It makes editing a little bit easier: You can login directly from the blog itself, and don't have to worry about logging into blogger. You can also edit capsules from the main page, without having to go into elements.

·         You get a teeny bit of traffic from the "next blog" button: And I do mean teeny. I can't even recall the last time I saw traffic from it.

How to remove it!
It’s very simple to remove the navbar of the blogger. We just need to paste the code given below to the “header” section.

Here goes the code: body{ margin-top:0px; position: relative; top: -40; }

Know what? I just made it simpler doing a podcast on the issue. Just watch the video tutorial below:

Did you like it? Please do give your comments.


  1. Valuable info for those using blogger. Nicely done podcast. Keep going!

    To your success!

  2. Very well explained divvya! I already removed it from my site, and it takes too long for me before I successfully made it. But this time, you'll make it easier than ever. Keep it up!

  3. Hey!
    great podcast. really very interesting and helpful

  4. Another great post!
    I am very happy that your blog is ranked at 8th position.

  5. Great one! really great podcast and helpfull too.

    thanks for sharing

  6. Keep It up!

    Good podcast. Waiting to have more podcasts.

  7. Hello! Friends.

    I got complaints that this code is not working. This code was designed to work on new templates of blogger. So, if you are using the older blogger templates, this code is not gonna work.

    I have retested this code, and can assure you that this code works fine with new templates of blogger without any problem.

    Secondly, I was asked a question that, will the removal of navbar would violate the terms and condition of blogger. Well, If you read the policy of blogger, you wouldn't find any thing been said about the "blogger navbar". So, there is no harm in removing it. If you are still not sure about it, please do post your question on google help forum.

    Thank you.