How to Add a Favicon

Today I am going to tell a Blogger Tip on How to add a Favicon to your blog or website. Before starting I will expose Favicon before Beginners in Blogging world. First of all what is Favicon? Favicon stands for favorite icon. It is a small image which is associated with website or blog. It is shown next or before site name in the URL bar of the most browsers.Look at following image:

Now why use a Favicon? It looks fine. You can show your website logo or products image in the URL bar. After all it is very easy to setup favicon in your blog or website. Lets start how to add a favicon on Blogger blog.

To add a favicon you need to have a favicon. There are many ways to create favicon. You can search for "Online favicon generator" in Google. You will find a lot of sites where you will can create free favicon. I use http://www.animatedfavicon.com/ to create animated favicon for my Blogger Blog.
Since you can't upload .ico files in Blogger you need to find free image hosting sites which let you to upload .ico file. I use Google page creator which allows to upload ico file. If you still are stuck what to do then try http://www.iconj.com/generator.php for both generating favicon and free hosting your ico files. Then get the link of favicon URL.

How to Add a Favicon in Blogger

1.Login Blogger.com

2.From dashboard select Layout. Then click on Edit HTML. Before editing HTML code save your template for your safety.

3.Then search for the following line:

<title><data:blog.pageTitle/></title>

4.Just after that line add the following code to enjoy your Blogger Blog favicon.

<link href='your ico file URL' rel='shortcut icon' type='image/x-icon'/>

If you can't upload ico file then as a alternative way of above tips you can upload a 16x16 or 32x32 size image in any free image hosting site.Then get the image URL. Now instead of ico file url add image file URL in the following code:

<link href='your image file URL' rel='shortcut icon' type='image/x-icon'/>

After that save the template. Now you can see the favicon in the URL bar beside your Blogger blog or website address.