[ Tutorial ] Change Blogger Favicon

I know so many tuts about how to change blogger favicon, unfortunately, most of them have not clear explanation. Because, inserting your link code between tag head not enough, they missed one condition, you must insert your code between tag head and below the blogger standard head tag. This is all you need to do.


Create / Upload Your Icon

You need to create and upload you image file on a photo hosting file such as imagebeep or just upload it on your blog (only .png and .gif file)

Link Code

<link href="{image url}" rel="shortcut icon" />

replace {image url} with your exact image
url that you've uploaded

Insert The Link
Go to [Layout]->[Edit HTML]

Locate The <b:include data="blog" name="all-head-content"> tag then insert the link code exactly below the tag.

Why? because Blogger automatically put <link href='http://www.blogger.com/favicon.ico' rel='icon' type='image/vnd.microsoft.icon'/> into your standard blogger head tag. It will be two favicon link in your HTML source code, but don't worry, browser will render the latest link (our customized favicon).

Happy blogging! :)

Share |