Tutorial: How to add a favicon to a Blogger blog
By Jal Desai | In: blogging tips, tutorial | Posted On June 18, 2009
One of my friend and a blogger asked me how to add a favicon to a Blogger powered blog. So I decided to write a post on it so that many others having the same question can get their answers. A favicon is a small (usually 16x16 pixels) image that appears in the title bar when a webpage is being viewed. It has no information value but looks nice and professional. So here’s what you need to do to make your own favicon for your Blogger powered blog.
1) First create a 16x16 image that represents your blog and upload it to any photo hosting sites like Photobucket, Imageshack, etc. The image can be a little bigger but anyways Blogger will display a 16x16 image only.
2) Now login to your Blogger account and navigate to Layout >> Edit HTML.
3) Now at Tech Explorer, we don’t take any chances. So back up your blog by downloading it. Click ‘Download full template’ link. But if you promise to be extra cautious, you can skip this step.
4) Now locate the following code in the HTML:
<title> <data:blog.pageTitle/> </title>5) Insert the following code immediately after the above code:
<link href='LINK TO YOUR FAVICON IMAGE' rel='shortcut icon' type='image/vnd.microsoft.icon'/>6) Replace ‘LINK TO YOUR FAVICON IMAGE’ in the above code with the link to your image.
7) Click ‘Save template’ button and enjoy your new favicon of your blog!