93 Fixing Custom Favicons for Blogger Blogs
November 06, 2008 /

Favicons A-Z by Dave TaylorMany Blogger users have reported that their custom favicon has suddenly been replaced with the default orange Blogger favicon.

The reason for this is that the 'all-head-content' includable (the content generated for page headers when your blog is viewed in a browser) has been updated to include the following line:

<link href='http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/>

Thankfully, there is an easy "fix" for this issue!


Simply locate the line(s) of code you have added to your Blogger template to reference your custom Favicon, and move these just before the closing </head> tag in your template.

The reason this trick works is because the code to reference your custom favicon appears after the lines added by Blogger to reference the Blogger favicon. In all HTML documents, code which appears later in the mark-up takes precedence over any tags which appear earlier (unless of course, statements are attached to make the earlier tags preferential!).

How to link to a custom favicon in your Blogger blog


If you do not already use a custom favicon for your blog, you may be interested to learn how to create one, so here are some useful links to other articles and resources on site:

Favicons and Internet Explorer

When using Internet Explorer 6, you will only see favicons appear in the address bar if you have bookmarked the site you are viewing.

The tern "favicon" is  short for "favorite icon", and as such Internet Explorer will only display the favicon of a site if the site is recognized as one of your favorites (ie: if you have bookmarked the site in your browser!).

Some people also report that the favicon will only display when viewing the particular page they have bookmarked, and not the entire site. In this case, you would need to restart your browser for the favicon to appear in the address bar of all pages.

Your internet security settings (both in Internet Explorer and any anti-virus/anti-spyware programs you use) may also affect whether or not favicons will be displayed in IE6.

Were you able to fix your broken favicon?


I hope this post has provided a useful overview of how to fix the link to your custom favicon in your Blogger blog. Please feel free to leave your comments and suggestions below.

93 Comments:

6 November 2008 12:44 Typhoon said...

Didn't got any such problem..My blog's favicon is properly working!

6 November 2008 14:00 Marzuki said...

cooooooooooooooolllllllllllllllllll

6 November 2008 15:03
Anonymous said...

hdrjd

6 November 2008 15:12 Luth Textile said...

my favicon also not working properly..

6 November 2008 15:27 Serena said...

I already move my favicon url as you have mentioned here earlier. It is working now. Thank you.

6 November 2008 16:01 panduan bisnis online said...

thanx for the info amanda! cool! :)

6 November 2008 17:12 Glass Dragonfly said...

Thanks for the fix. Seems to be working just fine!

6 November 2008 17:31 Kacrut said...

Thanks Amanda I like that, nice tips & triks :)

6 November 2008 17:47 Todd said...

Worked like a charm!!!

6 November 2008 20:48 maggies mind said...

Ah, so easy and so helpful. Thank you very much!

7 November 2008 00:54 mr-mung said...

good idea, thx for your info. may you visit my blog and give me comment abaut my blog, because the trafik is down. i'm very sad. thx.

7 November 2008 01:09 blackzero85 said...

Uh well... I gotta find my icon first before doing this... :(

7 November 2008 03:33 LilaTovCocktail said...

Yes, thank you, it worked.
I had no idea why my favicon had disappeared!

7 November 2008 03:54 Steve W. said...

Awesome....it worked! Thanks Amanda.

7 November 2008 04:26 Adam @ Low Tech Combat said...

Thanks heaps Amanda! This was bothering me for a while now. I just tried re doing the line of code numbers of times. Sometimes the favicon would appear for a couple of seconds then disappear.

Now it works fine thanks to you!

Its good to see you posting again.

7 November 2008 05:06 messynester said...

I couldn't get this to work. It kept showing up above the blogger tool bar.

7 November 2008 07:38 Sitges Bowling Club said...

MY FAVICON wasn't working... well, sometimes! but now with your trick is working always!

Thanx

www.sitgesbowling.blogspot.com
(the leading bowling blog in Spain)

7 November 2008 11:50 diTesco said...

Amanda, I would like to know if you have any hacks that enables gravatar to show on the comments. Thanks

7 November 2008 12:27 Schmitzl said...

I'm facing another problem. My custom favicon works fine in my site itself, but no longer in rss readers like Bloglines. Subscribers to my blog see the blogger favicon in their readers. It still shows up in the source of my blogpage (but not in my template, so must be genereated by browsers) Any ideas? I'm using a custom domain:

http://www.weblog.schmitzl.nl

for my blogger blog.

Thanks

7 November 2008 17:46 Skeeter451 said...

Thanks! That worked great.

--->Susan

http://skeeter451.blogspot.com/

7 November 2008 18:14 DEY said...

Hi :)
Thanks for this...
I am interested in the same as diTesco... Is there any trick to change the blogger favicon from the comments and replace it with our own?

And what about the bloglist widget of bloger???

Basically both of them take the favicon from the blog home directory and that is the part that does not show up in our html code... But if we can trick it for the favicon to show at the side of the url, there should be a way to do the same in the other two cases???

I will love to see my friends favicons in my BlogList instead of the blogger favicon :(

Love tons,

Dey

8 November 2008 02:43 Martin Kiš said...

Dont work for me :( I have tried everything. Could you help me plesase? Blogging at www.takto.sk

8 November 2008 07:29 t3ss4 said...

Thank you so much Amanda. This is indeed great help :) I actually thought there's no other way.

8 November 2008 09:57 Ecko said...

I have no problem with my favicon. It works properly, no modification needed anymore

8 November 2008 20:33 Rott said...

Thanks Amanda. This fix worked perfectly and now i can even see my favicon in IE7. Thank you darlin.

9 November 2008 10:46 cheth said...

I did exactly as you suggested but couldn't find the lines :( and one more thing Amanda I saw those lines when i opened my page in a new window and through the browser "View source" option i could see that line...

I can see the blogger favicon on this blog of yours too... seems like google did some more changes

9 November 2008 10:54 khammami said...

thnx the problem was fixed by blogger
so that why you don't have such as problem

9 November 2008 17:18 obrasileirinho.com.br said...

It is an excellent article how another one that you write. Congratulations!

10 November 2008 00:31 Hidup Itu Manis said...

Thanks for the instructions on the favicon! affan

10 November 2008 12:42 Jane said...

Yes I was able to fix mine but a week or more ago, but I googled Favicons and found another site that had the code and where to put it
I send you a email and also reported it on your site 2 or 3 weeks ago but had no reply. ?? Im glad that you were able to put a fix out for everyone else cheers

11 November 2008 02:15 koekoeh said...

Thnx for sharing! Cool info!

12 November 2008 00:07 Blacktating said...

Your favicon generator is down. Does anyone know another way to create a favicon from a jpg? I don't want an .ico extension because I don't want to create a new account at a hosting site just to have to change it. Thanks.

12 November 2008 05:25 Larissa said...

No, mine still isn't fixed :( I've tried everything.

12 November 2008 08:36 kRiZ cPEc said...

thanks so much! It worked!

12 November 2008 20:52 Adi said...

Hey amanda you are so cool, always have solutions for my problems.

Thanks from chile.

http://www.venuzcomplex.com

13 November 2008 14:46 Alex G said...

Thanks Amanda, your blog really bring inspiration hope that you write more stuff frequently !

13 November 2008 17:47 ~Joyshan~ said...

hi amanda, i have send you a mail concerning a go daddy domain, i have been able to redirect it ot metalikacrew.blogspot.com and masked it as metalikacrew.com but when www is inputed, it goes to google.mu.,,, what factor may be causing this as per you? please advise

13 November 2008 20:16 Karbonizma said...

Thank you very muck. I have a question to you. How do you think about my favicon? http://karbonizma.blogspot.com

14 November 2008 06:14 santoshi said...

Hi yours a great blog full of Ideas. Please visit my blog and give your expert suggestions to improve the look and feel of my blog.
Thank you,

15 November 2008 18:15 Anak Muda said...

Thanks for your tutorial ... :D

16 November 2008 03:07 ~Static~ said...

After trying your solution, it worked for a couple days and then my fav icon doesn't seem to be working again. =(

I'm using blogger draft. Halp! HaLp mE!

16 November 2008 10:38 Alvaris said...

A very nice post about Favicon, would refer to this post when I got a Favicon! :D

16 November 2008 20:40 setoan said...

thank you very mutch, i even didn't notice that my favicon has disappeared

17 November 2008 02:32 Lydia said...

Thanks! It works perfectly now.

19 November 2008 21:54 Jake Rhodes said...

This worked for me.

Thanks for the help!

20 November 2008 09:02 Vinit said...

I changed my favicon too !!

20 November 2008 17:59 Jaydip said...

YEs It's Working

21 November 2008 02:21
Jay White said...

Nice call, works like a charm.

21 November 2008 18:35 udung said...

im using plugin from maxx so i dont touch the code when i want to change it

26 November 2008 13:46 AMH615 said...

Wouldn't you know? I figured it out yesterday and found this post today! Doh!

27 November 2008 09:16 chethan said...

Hi Amanda i found a solution for this! :D actually the trick you mentioned here doesn't work sometimes.. i can see the same blogger logo in your blog.. .

to get the custom favicon

http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'

replace this by

http://www.bloggerbuster.com/amanda.ico' rel='icon' type='image/vnd.microsoft.icon'


it works for sure you can see it working on my blog :)

1 December 2008 00:29 Juliet said...

Thank you! I've been having this problem.

1 December 2008 00:30 Juliet said...

Thank you so much! I've been having this problem!

4 December 2008 10:56 Todd said...

This problem is happening again....any suggestions?

8 December 2008 15:20 synical said...

Thanks! Been wondering how to fix this as it's been several weeks now... :)

But it's only working in Firefox and not Chrome or IE.

8 December 2008 17:28 Aileen said...

I just encountered a problem with my favicon, but thanks to you....! I fixed it! ;D

Much power to you!

11 December 2008 11:40 Professional Lab said...

Thanks a lot..... I was looking for this. Itz working!

17 December 2008 18:36 ألعاب said...

I think this is an awesome post, but I wish you had discussed some points differntly.

27 December 2008 23:55 Mike Fan said...

My favicon functioned only in Opera and Firefox. After reading this post more carefully, I found that my favicon had to be hosted with the name "favicon.ico". If you're having similar trouble, renaming your file to "url.com/favicon.ico" may fix it.

Hope this helps!

Mike
http://365Sonnets.blogspot.com
http://SomeTurbidNight.blogspot.com
http://VoglioTempo.blogspot.com

15 January 2009 02:29 Amy, a redeemed sheep said...

Mike!!! You are a generous!! That was exactly my problem. It's finally fixed!!

Amanda, you blog is one of my favs!! Thanks for all you do!

22 January 2009 23:10 kousik said...

Thanks, fixed it!

10 February 2009 00:16 Daniel Goh said...

THANKS A MILLION!!! You're a genius :D

22 February 2009 06:23 Crysm said...

THANK YOU!! I was freaking out when it all of a sudden disappeared. THEN I couldn't find the new code. I googled it and of course I wasn't surprised when your blog answered my question. I should have come straight here. I find all the good stuff here as it is.

Thanks again!

13 March 2009 21:59 Rapid Entertainment said...

Wow,finally my favicon works,thanks Amanda

7 April 2009 11:21 kata said...

i using wordpress blog and already have favicon. The problem is, when my friend put my blog under his blogspot bloglist, no favicon appear, just my blog name only. Any idea to fix it. I using WP plugin for my favicon

8 April 2009 22:32 Alek Tomanov said...

For a long time even with your help i could not make the icon work, I have a mac, and the ico file didn't want to show for ages! But finally first I found a good tutorial http://findhow.blogspot.com/2007/10/tutorial-how-to-change-your-blogger.html
And I used png instead of ico and everything worked better, no hassle to search where to host the ico file no problems at all! Amanda thank you anyway.

19 April 2009 08:14 Jay said...

If you need to convert a .jpg to an .ico file use the free program Irfan View at: http://www.irfanview.com/

3 May 2009 14:07 Karcee said...

thanks for it

karcee

4 May 2009 06:00 Preetish said...

Thank you

great post

19 May 2009 01:40 Melissa said...

so mine isn't showing up at all...I'm snot sure what I'm doing wrong...

greenleavesdesign.blogspot.com

16 June 2009 16:56 browser games said...

great, it works, thanks

24 June 2009 05:29 RM said...

Hi,
Good information; however when I use the info on my test page it either reverts to the "e" or does not change. The page is at
http://www.rm-test-rm.blogspot.com/
Please advise on what I should do.

Thanks

26 July 2009 13:55 Shaun Judy said...

This method works as it is the way I had my Fav Icon when I used blogger. Thanks for the share

25 August 2009 05:12 PixelShots said...

my favicon appears for only the home page.. www.pixelshots.blogspot.com...

when an internal link is clicked the blogger icon is coming... any fix?

25 August 2009 05:19 PixelShots said...

ooops.... sorry yaar, i just commented the problem, havent tried what u said.. am typing this after the try that u said above.. it works...

thanx for the fix....

pixelshots.blogspot.com

4 September 2009 19:02 top ten antivirus said...

Wow! Just a small line of code added and the results are great !

7 September 2009 18:03 Miamidiver06 said...

Did Blogger just come up with a new way to trump user created favicons? Mine don't work now, even with this tip that worked before.

http://www.iheartdiving.com

1 October 2009 18:57
Anonymous said...

(-:

I HAVE 97 BLOGGER SITES!!!

HAD THE SAME FAVICON ON ALL OF THEM!!!

TWO WEEKS AGO, THEY ALL TOOK A POWDER AND WENT BACK TO BLOGGER!!!

CAN ANYONE HELP ME???

DO NOT UNDERSTAND CODE THAT WELL, CANNOT SEEM TO STEP OUT OF THE BOX TO UNDERSTAND!!!

MY E-MAIL IS:

F410@LIVE.COM

ALL THE BEST, YOURS IN CHRIST,

COMMANDER WALTER K. VAN DER VEER

7 October 2009 05:34 TheSovietChairman said...

This works for FF and IE, but not for Google's own Chrome...


Crafty beggers :)

7 November 2009 00:37 g said...

yay- thanks for the fix- it was driving me crazy!

15 November 2009 20:35 SSHUC &amp; Metropolitica said...

For all those who have done this hack and it is still not working, rename your favicon file to "favicon.ico". If you are using a gif or png, rename the file to "favicon.gif" or "favicon.png" respectively. Make sure to update the line of code that references the favicon in your template code.

30 December 2009 20:50
Anonymous said...

How do you get the Favicon to work on Blogger static pages?

13 January 2010 19:36 Steve W said...

for those that can't get it to work in Safari or Chrome add:

type='image/x-icon'

at the end of both lines of code for the shortcut icon and the regular after the rel reference. Worked for me but still struggling with IE8 and FF.

13 January 2010 20:09 Steve W said...

In addition to the above, just got it working by putting it directly below the all-head-content area, ahead of the main css in all other browsers.

Uf, details details....

23 January 2010 15:39 Peter said...

I found this newest tip it will help to new web-blogger users to create their favicon for blogger blog.After using i seen this tip is an easiest way.Get "the easiest way" tip from this post full guide to check and validated your favicon...
Sharing good tips was my point of blogging .Enjoy ! new friends by reading my comment.at here.

13 March 2010 17:04 Dan Holzman-Tweed said...

I can't get the tip to work at http://defense-rests.blogspot.com.

14 March 2010 10:02 Anas said...

Still not working

27 March 2010 07:57 Jenny said...

Thank you for the tips and fixes about favicons, my favicon works both in Mozilla and Chrome now! Here is a tip that worked for Chrome, I found it on bluejar. In summary, you need to add type="image/ico" in the link definition line. I created my favicon on ms paint and saved it as .png, so I changed the type to "image/png". You can upload .png files on most photo-sharing sites.

25 May 2010 18:59 Keith a.k.a. K j A M said...

Thank you, thank you, THANK YOU! I have two blogs on Blogger and one works with no problems, but the newer one I could not get to work. With you tip, it's now working great! Much appreciated. http://www.bpmedition.com

3 June 2010 14:38 Eric said...

thanks a lot! my problem's solved!

Post a Comment

Browse through the Archives

All existing posts are still available to view while I'm working on the site, albeit seen in a much simpler interface. Feel free to browse through the archives to find tutorials, templates and articles to help you build a better blog:

Blog Archive

© Blogger Buster 2010 Home | About | Contact | Hire Me