Favicons are those little icons in the Address bar and next to your Favorites. When I migrated to Blogger, I lost my custom favicon and inherited the default, orange “B.” To restore it to my original “j.u” favicon, I performed some first-grade slight-of-hand trickery (It’s really easy).
- Choose a favicon host.Although possible, Blogger doesn’t make it easy to upload non-post files. To get your favicon online, you need to sign up with an image host. I chose ImageShack since I had a few things on there already. Others you could use include Photobucket or even GooglePages.
- Create my favicon.If you’re creating your own, simply create a 16 x 16 pixel image. You can save it as a GIF or PNG. They should both work.I already had a favicon, although it was in .ico format. When I was on my own server, that was fine, and correct. ImageShack, however, doesn’t allow the uploading of .ico files. I had to convert my file to a standard image format. I chose PNG.
- Upload my faviconI uploaded my favicon. Imageshack gave me a few choices of code to use to display my favicon. I copied the “direct” URL and pasted it in the next step.
- Add favicon to templateOnce my favicon was online (it took less than 4 minutes), I inserted the appropriate HTML into my Blogger template.
<link href="URL_TO_YOUR_FAVICON" rel="shortcut icon">
The whole process took less that 10 minutes, and almost less than 5. If you’re ready to dump that orange B for a spiffy new icon that better represents your blog, the four steps are all you need. If you need help with any of the steps, feel free to leave a comment.Update: If you’re getting some kind of parse error in Blogger, it’s probably looking for a closing tag. Try this code instead (note the added slash toward the end). <link href=”URL_TO_YOUR_FAVICON” rel=”shortcut icon” />
