Add Favicon To Blogger/BlogSpot Blog Easily

Create A Favicon For Your Website
Fastest, Easiest and The Best Method Available On Internet

(You may even directly use an animated *.gif image as a favicon)
Add Favicon To Blogger/BlogSpot Blog Easily
This is the easiest way to create a Favicon (the small icon  of a website visible at the along the url in the address bar) for your website !

There are many favicon generator websites, where you have to first upload a picture, edit/crop it and finally you get a *.ico that you can not even easily open to see, before you use it. Moreover if you want an animated *.gif image, then it makes the process even more difficult.

So finally here’s the most simple code, edit & add it in the “head” region of your blog/website…. thats it!
You will see a new favicon the next time you open your website.

Log in to Blogger -> Layout -> Edit HTML
Find this in your template

</head>

And immediately ABOVE?BEFORE it, paste this code:

<link href=”http://YOUR_IMAGE_ADDRESS_HERE.gif” rel=”shortcut icon” type=”image/vnd.microsoft.icon”></link>

Replace the link in RED, with the DIRECT LINK to your favicon-image.

To get the direct link, upload the desired image here first – Tinypic

Leave a Reply

48 Comments on "Add Favicon To Blogger/BlogSpot Blog Easily"

Notify of
avatar
Sort by:   newest | oldest | most voted
snam
Guest

How do I make animated favicon then?

View Comment
Divya Sai
Guest

If you use an animated image [animated gif image], then it will be displayed along with its animation, it’s better if you use an image of 60×60 or 80×80 dimensions !

View Comment
snam
Guest

Thanks!
But on one of my blogs, the favicon is not working even though the code is the same as the blog that is working. What should I do?

View Comment
Divya Sai
Guest

hi snam

Find this code in your template:
</head>

them IMMEDIATELY ABOVE IT, add that favicon code, that's it !

View Comment
The Root's
Guest

I just added the code in the correct and it is not working. Does blogger not allow this? I am REALLY new to editing HTML but have been pretty successful so far. Any suggestions?

View Comment
Divya Sai
Guest

Hello "The Root's"

I have checked the source code of your blog, you have placed the code above <head>

but you have to place it above </head>

So correct this placing, and it will start working !

Regards
Sai

View Comment
Laura
Guest
Sai, Thanks so much for the response. I corrected the placement issue and it’s working great in Firefox but not IE. I will have to work on that issue. I have to say I have been having a lot of fun creating this blog for my sisters family – The Root’s. They had one through their adoption agency that was not the best and rather boring. There are still a few things I need to work on and add. I do not like the fact that on tab in Firefox the entire Blog name is not listed. I have tried… Read more »
Divya Sai
Guest

Hello Laura

1. The favicon you are using is an animated image(.gif), which will therefore doesn't appear in IE, you can use a normal .jpg image, if you want it to be displayed in IE.

2. You are always welcome on this blog….make the best blog for your sis – good luck for that.

3. To Display the complete title in your Internet browser's tab;

You'll see this code in your blog (5th or 6th code line in your template):
<title>Waiting For</title>

So replace "Waiting For" with "Waiting For Maisy

Thats it !

Regards
Sai

View Comment
Divya Sai
Guest

And Laura, recently when i checked your blog, the favicon wasn’t being displayed, that is not because of any code error, but the image address (http://sig.graphicsfactory.com/Diamonds/m.gif) itself wasn’t working.

So i suggest you to change the image host.
Download that image or any (small)image and upload it to gigaimage.com, copy the direct link and paste it in the template.

View Comment
Laura
Guest

THANKS so much Sai! It all works now.

I am sure I will be back for additional advice in the near future 🙂

Laura

View Comment
Laura
Guest

Well Sai,

I spoke too soon. I just opened the blog in IE and my favicon does not appear. It is still using the Blogspot one. Looks great in Firefox 🙂

View Comment
Divya Sai
Guest

Make sure that this code is DIRECTLY above the
</head> line, and nothing is in between them…..tell me if it works or not !
Good luck !

View Comment
GNJ
Guest

So How about for http://www.sitename.co.cc! How to change the icon of !

View Comment
Laura
Guest

Sai,

Well, it is directly above head and works great in Firefox, just not IE. I rarely use IE, but would still like it to work both places. Any other suggestions? I am such a newby that I cannot figure out where the error is.

Thanks again for all of your help 🙂

Laura

View Comment
Divya Sai
Guest
Hi Laura Well there are some issues with IE, you first try to bookmark your blog in IE (then restart IE) and see if it works. -*-*-*-*-*-*Otherwise replace the previous code with these two lines: <link rel="Shortcut Icon" href="favicon.ico"> <link rel="icon" href="favicon.ico" type="image/x-icon"> replace bolded regions from both the lines, with the address of the ico file now you CANNOT use any jpg or gif image, rather you have to use a .ico (an icon image) You can use this web site to convert an image into a .ico file: http://www.degraeve.com/favicon/ then upload it to hotlinkfiles.com to get a direct… Read more »
GNJ
Guest

Thanks for all of your help sir!
For this site http://shanworld.co.cc/index.html/ he can change the icon! i don’t how he did!
I will try as you said!

View Comment
Divya Sai
Guest

co.cc only provides you with a domain name, so you can of course change anything you want:

For ex, take hosting from
110mb.com , or
freehostia.com

And take a domain name from co.cc,
now redirect this domain to your hosting account,
and upload any index.html file to your hosting (with any favicon etc.),

that’s it !
Now you’ll have a domain name from co.cc while you’ll be having all the control over the website !

If you want to combine Blogger and co.cc or Blogger and 1and1.com, read here:
Domain And unlimited Hosting From Blogger

View Comment
Shesten
Guest

Hi I get this error when I try to past it:

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The reference to entity "feat" must end with the ';' delimiter.

This is what I'm trying to paste: <link href='http://picasaweb.google.com/lh/photo/eR6GdI8nraLupCUjAg5WOw?authkey=Gv1sRgCM2IssadtcTCgQE&feat=directlink&#039; rel='shortcut icon' type='image/vnd.microsoft.icon'/>

Can you tell me what I'm doing wrong>?

View Comment
Divya Sai
Guest

Hi Shesten,

There’s no entity as “feat” in this code, so that error is due to some other widget/hack in your template …

View Comment
Shesten
Guest

Interesting! Thank you!

View Comment
wpDiscuz