Favicon (Favorites Icon) is the small picture (usually 16px x 16px in size) you see beside some some site's name in your browser's address bar. Having your own favicon with a nice graphical reminder of your site beside is a good way to get visitors attention. Blogger users can add a custom favicon for their blogs going to the Layout section and by clicking on the Edit link on the "Favicon" element.
"For many bloggers, having a custom favicon (the tiny image displayed in your browser’s window or tab) is the finishing touch that ties together the design and identity of a great looking blog. Today, we're pleased to announce that Blogger in Draft users can now add a customized favicon to their blog. ~Blogger in Draft"
How To Add a Favicon to Your Blogger Blog
Step 1. Log in to your Blogger's Dashboard, go to the Layout and click on Add a Gadget link
Step 2. Click on the "Edit" link on the "Favicon" setting above the navbar element.
Step 3. A popup window will open where you can search for an image in your hard drive to replace the default favicon image. Click on "Browse" button and search for your favicon (it should have the .ico extension) - then click on "Save".
Step 4. Now you should see your own favicon instead of blogger's default favicon.
It might take some time until your new favicon will appear in your Browser's tab or window.
If you want to add animated favicons to your Blogger blogs, then follow this method below.
How to add an animated favicon in Blogger
Step 1. Log in to your Blogger account > Template > Edit HTML (if needed, click on Proceed button)
Step 2. Select the "Expand widget templates" box
Step 3. Search (CTRL + F) for:
<b:skin>
Step 4. Paste this code just above it:
<link href="your-favicon-links-goes-here" rel="icon" type="image/gif"/>
See the screenshot for more details
Note: replace your-favicon-links-goes-here with your favicon's link location
You can choose from here some cool favicons for your site/blog: http://www.favicon.cc/ (just download the favicon you like - upload it on tinypic or on a blogger's post, then copy the link address/direct link)
Step 5. Save the Template. And you're done!
what is tiny pic?
That's it! well explained
doesnt work for me please help
please help i cant change my Favicon i dont know why
thanks! :)
The favicon you created might be a larger one..
so create a 16X16 picture and save it with .ico extension or change it to icon using tools like formatfactory after saving it as jpg or png or any other picture. By this we can get a picture less than 100.
Even I couldn't change my favicon..But now I got it..
Try this method... have a good day..
my favicon is replaced but it is not changing i have uploaded animated favicon..Please help!!!
Hi Serve Boy,
Chrome and IE don't support animated favicon. As far as i know, only Firefox support it. Sorry for that
It is not appearing in tab, how long will it take(a guess)?
How Much Time It tooks TO Change?
I Change It with 16x16 icon
thanks.note(not an animated icon)just normal icon ;D
i use chrome
Thanks so much!!!
Then why are you still using the default?
How come that your favicon is not working in chrome? Like mine, I think this solution will not work in chrome browser.
site wich can uploade pics and then use the url with ur pic for ur blogg as background/favicon etc
hello Friend your site looks great and all post are awesome. how to check blog views in blogspot.
its not working, help me.. :(
Followed the instructions to a tee but it doesn't work. Also, there is no way to change the extension to .ico in photoshop. The favacon is still the blogger one.
thankx
blogger's setting's are not supporting .ico
Its saying invalid format.
But accepting other formats like .png very well
my favicon is 16*16 px but it also not work for me plz help.
nice post and nice blog
Thanx For Sharing Nice Post
I have change my favicon icon, thanks to you!
www.drsneez4u.com
please help where can i get not animated favicon
doesn't work
It perfectly works but why it is a kind of blurry and not understandable.
http://readerssightandsmell.blogspot.com/
it doesnt work :(
It's work thank you very much...
If in mobile i can't change my blog favicon. So, how i can change my favicon?
Thank you for your complete explanation. It really works! Great post sharing.
Thank you very much for the sharing,
I will try it.
Hi I do this but don't appear to my safari :( but the other tutorial of comments widget works so nice, and I also pinned it in my pinterest. Thank you !
hi, I tried adding it into my site but it's not appearing on chrome, only in firefox :(
www.1like4.me
SWEET :) Thanks!
Very well explained.I like it.I appreciated you.Keep it up thank you
wah ternyata gampang juga ya bikin favicon
thanks!!
after i uploaded the image for favicon, it is not showing..
Thanks for the help <3
Thank you so much. It worked!
thnks dear
Thanks a lot!
http://handynettips.blogspot.co.uk/
We can use our site logo in the place of Favicon provided size is 16X16 px . nice stuff.
Regards,
Divya @smtutorial
Thank you so much! I appreciate it. :)
It works on Explorer but not on Chrome. Does Chrome need more time or is there a problem? Thanks!
www.audreysglams.blogspot.com
Oh ok I just clared the cache and it works, thanks!
doesn't work...plzt teach me how to add....which url have to replace???
Thanks dude you brighten my day.
can you help? i dont know where im going wrong?
Hi Sarah,
Try to clean your browser's cache and then restart it.
i have added favicon component in my template, but still it is showing blogger default favicon. Pls help me.
thanks, this really help me
nice post ...but my favicon didn't removed when i try to remove it
www.atultec.org
thanks worked for me on firefox but not chrome
http://girlallover.blogspot.com/
nice post, I've tried it but it seems not work on my blog
I followed all the instruction well, but it's not work :(
http://ayokepo.blogspot.com/
or
http://eka-design.blogspot.com/
My favicon changed on my tab but not my blogger profile (next to my name) on the side of my blog. Any idea how to change it there? Thanks!
www.gritandtang.blogspot.com