Tuesday, 12 July 2011

How to add a custom favicon to your Blogger blog?

Favicon also known as a shortcut icon, Web site icon, URL icon, or bookmark icon is an icon associated with a URL that is variously displayed, as in a browser's address bar or next to the site name in a bookmark list.
So have you every wondered how to add a fancy favicon visible next to your blog URL? This will surely help you!

  • Firstly you need a 16x16 .ico picture which you can generate by using favicon.ico Generator and upload it to a image hosting site which supports .ico images like ImageBoo.
  • You can also get a readymade .ico favicon from sites like Favicons R Us, FreeFavicon.com & Iconlet.com.
  • Go to Blogger & sign in.
  • When the Blogger Dashboard appears click on the “Design” below your blog title which you want to put the favicon in.
  • Now click on Edit HTML on the top.
  • Now press CTRL+F and then search for “]]></b:skin>” (Without the quotes).
  • Just below ]]></b:skin> add: 
    • <link alt='Favicon' href='http://mywebsite.com/Favicon.ico' rel='shortcut icon' type='image/x-icon'/>
    • <link alt='Favixcon' href='http://mywebsite.com/Favicon.ico' rel='icon' type='image/x-icon'/>
  • Replace http://mywebsite.com/Favicon.ico by the location of your favicon icon.
That’s it! In a few simple steps you have created your own favicon image and installed it on your Blogger Blog!