How to Add Your Favicon to Blogger Update
Google/Blogger broke the instructions in the previous post about how to add your own favicon to a blogspot blog by adding some HTML that referenced the Blogger.com favicon instead. Fortunately the fix for this is relatively simple. Here is what has happened.
Blogger.com has added their own HTML to the templates near the top referencing their favicon. It looks like this if you look at the source code.
<link href='http://www.blogger.com/favicon.ico’ rel=’icon’ type=’image/vnd.microsoft.icon’/>
The instructions on How to Add Your Favicon to Blogger in step three says to add your own HTML code referencing your favicon right below the <head> tag. The web browser however will use the last reference so the Blogger.com favicon code was coming later on. The fix for this is to place your favicon code just before the closing <head> tag that looks like this: </head>.
Your code referencing your custom favicon then overrides the Google/Blogger.com code for the favicon and your custom favicon will return.
I tested this on the Free Favicon Blogspot blog and the favicon has returned. Give it a try on your Blogspot blog and let me know if it works.
November 22nd, 2008 at 10:50 am
Hurray, it works! Thanks so much for the advice! I ended up having to copy your exact code from the previous how to and then paste my image location over yours for it to work, but it works :)
November 24th, 2008 at 1:07 am
Glad it works for you!
November 29th, 2008 at 8:44 pm
Where can I host the image? I have blogspot account, FYI. I want to change my goddamn useless favicon… -_-
November 29th, 2008 at 8:44 pm
Btw, I’ll stumble this for you if this method works. :)
December 5th, 2008 at 3:30 pm
cant get it to work for me
i keep getting a error
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 value of attribute “href” associated with an element type “null” must not contain the ‘<’ character.
December 14th, 2008 at 10:56 pm
@blackzero85 Use a png or gif as the favicon and you can host it on Blogspot. Just upload it to a post and copy the URL for the link tag. If you don’t like that idea you could use a Flickr account, or Google Page Maker account or a free image host I suppose. A free image host could/will delete it probably at some point. I would just use Blogspot though that way it is all there.
December 14th, 2008 at 10:59 pm
@brad Sorry to hear you are having problems. Make sure you are viewing the HTML code. I have not run into that problem and I was not able to repeat that problem on my test blog. My best guess is that you are not in the Edit HTML mode for your template.