How to Create a Favicon on Blogger (the little picture thingie in the address bar)

Ever wonder how people get the cute little square icons up in the address bar and on the tabs of Internet Explorer? Do you adore the little apple you see when you pull up my blog? Those cute little pics are called Favicons and it's easy to do your own!

I had to read about 15 different sets of instructions to finally get it to work on Blogger, so you can take advantage of my wasted time and save some of your own!

1. Go to www.iconj.com . On the right-hand side, there is a spot labeled favicon generator and favicon.ico hosting. It works best if the picture you're using is square because it's going to convert it to 16 x 16 pixels.

2. Choose your picture, sharpen it if you want to (sharpening will help if you are using a photo or something with detail), and click Upload Now.

3. It will return with a Direct Download, but don't use this--it isn't Blogger compatible. Picasa will not host .ico files, so you'd have nowhere to put it (took me forever to figure this out). Underneath, it says Host it at IconJ. Copy this link.

4. Sign into Blogger, choose Layout, and then choose Edit HTML. About 5-6 lines down, you'll see the command < head > Paste the link directly under it. Then paste it again and go to the end of the link and delete the word shortcut. If you only paste the link in once, it will only change the icon up in the address bar and not the icon on the actual page.

5. Click Preview Template. You should see your favicon appear! If you do, you can click Save Template! Be cautious while you are editing in HTML and don't accidentally delete a bunch of stuff! But, you can always click Clear Edits if you haven't saved your template yet.

Here is a screen shot of what my template looked like with the edit. You can click it to enlarge.

Happy Favicon-ing!