How to Add a Favicon to Your Blog

In my pursuit to build a totally awesomer blog-site, I'm doing a lot of internet and book research. I hope to learn a thing or twelve but we'll see how that goes. Lately, I have trouble remembering what day of the week it is, so I wouldn't be surprised if very little new information can be retained at this point.

However, any information I do absorb? I intend to pass along to all-a-y'all.

So on that note (and many of you brilliant ones may have already guessed this by the title of this post, but): GUESS WHAT?

I HATH LEARNED ME SOMETHING USEFUL AND GOODLY!

* * * * *

Do you know what a favicon is? It's that cute little personalized icon next to a website's address. Wanna know how to make one? Yes? Good, because I'm going to tell you anyway.

If you have Photoshop:

The icon needs to be 16 x 16 pixels. Your icon will be teeny-tiny, so don't design anything too intricate. This site details how to make a Favicon beautifully and also links to places where you can get inspiration for the Best Favicon Ever. (Yours, of course.)

Make sure you download that Photoshop plug-in or you won't have the .ico file format available to you. Once you've downloaded it, find your Photoshop folder, and within it your File Formats folder, and place the .8bi file in there. Restart Photoshop. Now you'll have the .ico format available to choose from when you Save As.

Don't have Photoshop? Or just want life to be easier for you?

You can create an icon from a picture you already have! Try this site. They do all the work for you!

There's also a program called IconEdit32 that you can download that allows you to make little icons...Just Google it.

Everybody together now...

People with personal websites put the .ico file in their home directory - but we bloggers don't have access to those sorts of things! So we need to upload it to a site where we can link to it. Unfortunately, Flickr will convert it to a .jpeg - and most other sites can't handle .ico files either.

So wanna know how to do upload that sucker? Okay! Ready? Here we go.

You go to Ripway.com and sign up for a free account! At Ripway, they let you upload ANY type of file! WOO HOO!

Adding it to your Blawwwwg:

Go into your Blogger template. Directly below the "head" tag (in the very first few lines of code), paste the code below - only substitute the address of where your icon is located in place of my sample address.

<link rel="icon" href="http://example.com/favicon.ico" type="image/x-icon" />

<link rel="shortcut icon" href="http://example.com/favicon.ico" type="image/x-icon" />

Ta-da! (Or possibly: Troubleshooting!)

Firefox: If you're using Firefox, it should show up on its own because Firefox rocks. (The rest of you should download Firefox here and never look back.)

Internet Explorer: You're probably pissed right now and yelling some variant of "Why isn't that shit showing up, yo?!?"

Here's why: Internet Explorer is pretty retaaaaded. (Say in a Boston accent for maximum effect.)

If you are using IE, please add your own site to your Favorites. Then close IE and open it back up.

Safari: Per Lauren, you need to empty your cache for it to work (Safari --> Empty Cache). (Thanks, Lauren!)

* * * * *

Did you do it?? DID IT WORK?? I hope so. If not, please don't send me hate mail. I'm just a novice who's trying to help you make your blog a teeny tiny bit cooler, that's all...

UPDATED TO ADD: I have Illustrator and Photoshop. If you would like me to make you a Favicon, just let me know. If you have an idea of what it should look like, let me know. Otherwise, I'll check out your site and just come up with one on my own. This is fun!