Many 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 made easy (newer version, using png or gif files)
- Create a favicon for your blog (older version, using .ico files)
- Generate your own favicon from a JPG image
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:
Didn't got any such problem..My blog's favicon is properly working!
cooooooooooooooolllllllllllllllllll
hdrjd
my favicon also not working properly..
I already move my favicon url as you have mentioned here earlier. It is working now. Thank you.
thanx for the info amanda! cool! :)
Thanks for the fix. Seems to be working just fine!
Thanks Amanda I like that, nice tips & triks :)
Worked like a charm!!!
Ah, so easy and so helpful. Thank you very much!
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.
Uh well... I gotta find my icon first before doing this... :(
perfect! Thank you!
Yes, thank you, it worked.
I had no idea why my favicon had disappeared!
Awesome....it worked! Thanks Amanda.
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.
I couldn't get this to work. It kept showing up above the blogger tool bar.
Thanks Amanda
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)
Amanda, I would like to know if you have any hacks that enables gravatar to show on the comments. Thanks
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
Thanks! That worked great.
--->Susan
http://skeeter451.blogspot.com/
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
Dont work for me :( I have tried everything. Could you help me plesase? Blogging at www.takto.sk
Thank you so much Amanda. This is indeed great help :) I actually thought there's no other way.
I have no problem with my favicon. It works properly, no modification needed anymore
Thanks Amanda. This fix worked perfectly and now i can even see my favicon in IE7. Thank you darlin.
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
thnx the problem was fixed by blogger
so that why you don't have such as problem
It is an excellent article how another one that you write. Congratulations!
Thanks for the instructions on the favicon! affan
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
Thnx for sharing! Cool info!
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.
No, mine still isn't fixed :( I've tried everything.
thanks so much! It worked!
Hey amanda you are so cool, always have solutions for my problems.
Thanks from chile.
http://www.venuzcomplex.com
Thanks Amanda, your blog really bring inspiration hope that you write more stuff frequently !
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
Thank you very muck. I have a question to you. How do you think about my favicon? http://karbonizma.blogspot.com
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,
Thanks for your tutorial ... :D
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!
A very nice post about Favicon, would refer to this post when I got a Favicon! :D
thank you very mutch, i even didn't notice that my favicon has disappeared
Thanks! It works perfectly now.
This worked for me.
Thanks for the help!
I changed my favicon too !!
YEs It's Working
Nice call, works like a charm.
im using plugin from maxx so i dont touch the code when i want to change it
Wouldn't you know? I figured it out yesterday and found this post today! Doh!
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 :)
Thank you! I've been having this problem.
Thank you so much! I've been having this problem!
This problem is happening again....any suggestions?
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.
I just encountered a problem with my favicon, but thanks to you....! I fixed it! ;D
Much power to you!
Thanks a lot..... I was looking for this. Itz working!
I think this is an awesome post, but I wish you had discussed some points differntly.
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
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!
Thanks, fixed it!
THANKS A MILLION!!! You're a genius :D
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!
Wow,finally my favicon works,thanks Amanda
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
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.
A good work.
Infomist Services
If you need to convert a .jpg to an .ico file use the free program Irfan View at: http://www.irfanview.com/
thanks for it
karcee
Thank you
great post
so mine isn't showing up at all...I'm snot sure what I'm doing wrong...
greenleavesdesign.blogspot.com
great, it works, thanks
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
This method works as it is the way I had my Fav Icon when I used blogger. Thanks for the share
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?
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
Wow! Just a small line of code added and the results are great !
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
(-:
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
This works for FF and IE, but not for Google's own Chrome...
Crafty beggers :)
yay- thanks for the fix- it was driving me crazy!
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.
How do you get the Favicon to work on Blogger static pages?
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.
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....
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.
I can't get the tip to work at http://defense-rests.blogspot.com.
Still not working
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.
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
thanks a lot! my problem's solved!
Post a Comment