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 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 tag that looks like this: .

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.