Tuesday, October 31, 2006

how to get rid of the navbar in your blogspot blog, yo

First things first: All thanks and love to Schmutzie, who showed me how to do this fix. If you want to thank someone for this, thank her. I'm the messenger.

Hey friends (you are my friends, right? You're not going to do that thing where you walk up all friendly and then stick me in the back of the neck for the mob money, are you? Because mob justice - that's not okay. Not in my book. Not between friends.). Do you walk around hating the navbar at the top of a blogspot blog? Does it make you grind your teeth and strangle wildlife? Maybe something like that? All I know is, I get to thinking about the navbar and suddenly all the geese and deer in the park are dead.

I'm not sure if this constitutes a gross violation of Blogger's terms of use - I am way too lazy to go look - but here's a handy way to remove the navigation bar from your site. This particular method works for the beta blogs only, but there's an easy fix for old blogspot blogs.

1. In order to do this, you need to start poking around in the HTML. Get some gloves first. Okay, got the gloves, that's good. Click on the Template tab and choose 'Edit HTML'. If you're the nervous kind, with the sweats and shivers and the rolling rheumy eyes, you may want to download your template just in case.

2. In the template, find the body, near the top of the page. Here's what mine looks like:
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
text-decoration:underline;
}
a img {
border-width:0;
}
3. After the image attributes, insert the following code:
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
That should do the trick. For old skool blogspot blogs, the navbar is not an iframe element (as far as I know), so you should be able to get away with inserting the same code but removing the "-iframe" bit.

Now you are free of all your navbar troubles. No more hitting the 'next' button and finding yourself at some crazed right-wing blog, or a fourteen year old Filipino girl writing about her kooky friends, or a spamlog offering stock tips or herbal Vuhz@gra. You're one step closer to never having to experience anything ever again unexpected or in any way discomfiting.

Speaking of which, go read PWOT's article on the subject.

11 comments:

Birchsprite said...

hoorah

i've been wondering how to do this for a while!

sporky said...

i'm pretty sure it is against their tos but it doesn't look like they're exactly cracking down.

also, schmutzie posted about this on her site ages ago. where have you been? is there another woman whose blog you're reading?

palinode said...

Sporky:

Schmutzie already posted this information? Bear in mind that I live with her, so for me there's a blurry line between our conversations and what we put up on our weblogs. One thing's for sure: when it comes to things webical, I'm behind her curve.

And yes, there is another woman whose blog I've been reading. She's terribly frightened of me, because I keep sending her emails that say "You are my wife" and "Why don't you acknowledge me as your husband under God?" and whatnot.

Anyway. How's my new template? Note that I'm using your helpfully colour-corrected image.

sporky said...

i like the white, i'm not hatin'

i would like to sign in under my own name, but honestly your word verification scares me and if i switched identities i think i might never get back in.

qcmqnk

jchevais said...

Wasn't Schmutzies previous "get rid of navbar" info regarding regular Blogger blogs and not blogger beta?

Thanks for the tip.

My Head Is Too Big said...

Yay. I'll take another crack at it. The first time I tried I think I made it worse, so I just changed it to black and hoped no one would notice.

My Head Is Too Big said...

Dammit. Still didn't work. I pr'olly accidentally inserted code that gives every visitor face cancer.

Ordinary Janet said...

That's too much work. I switched to Wordpress. I managed to get it set up without blowing it, which is saying a lot about its ease of use.

Adam Cheasley said...

Thanks for this. Works perfectly.

Jerrika said...

Thank you for the update! I had gotten rid of it in the old blogger but it had reappeared when it got converted to the new one.

In addition to the code you wrote here that makes the navbar disappears, I use another line of code that shifts the whole blog back where it would be if there were no navbar at all:

body {
position:relative;
top:-32px;
}

It makes the blog look cleaner than leaving a blank space I find. Feel free to use it.

BElieVE said...

works perfectly

thatnks for the tip