How to Add a Favicon to Blogger

Favicons on Blogger

This post will show you how to add a favicon to your Blogger blogs.

What is a favicon?

Let me show you.



A favicon is simply a little mini graphic that appears in the tab box of your browser. Does it help you in regards to SEO? Nope but it does make that ugly Blogger image disappear and gives your blog a little uniqueness.

Adding a favicon is actually really simple and any technically challenged person can do it in a matter of a few minutes.

The first thing you will need is a picture to be used and have it uploaded on your computer. Keep the photo under 1MB in size.

Next go to this site. Free Favicon Generator

You will see the tool shown in the image below. (click all images to enlarge)



Hit the browse button and find the photo you want used stored on your computer.



Once you have selected the desired photo just click the upload button. This will create and store a .ico photo on the server used by the tool. An .ico extension is for windows icon.

You will now see the following screen.



Just cut and paste the code in the lower box into your Blogger Template.

In Blogger;

Go to Layout - Edit HTML - Expand Widget Template - You will see a version of the screen below.



Insert code just above the < /head > tag, click Save Template and you are done. Your photo will now show up in the tab on your browser when your site is loaded.

Cheers

Griz

22 comments:

  1. I always wondered how this was done. Now I know.
    Can't wait now to find a favicon to use.
    Can we do the same technique to WordPress blogs as well?

    Thanks for sharing!

    ReplyDelete
  2. Hi Denise,

    Hope all is well.

    Yup - you can do the same with WP. Just add the code before the < head > tag just like Blogger.

    ReplyDelete
  3. Great!
    Like you said won't make me any money but just a fun thing to do.

    ReplyDelete
  4. I just tried this Favicon on my new Blogger Blog and could not get it to work. Is it because it is new?

    By the way what is the
    < meta content=" that you have blacked out? Is this a secret weapon?

    ReplyDelete
  5. Griz,
    In the diagram that was up here b4, you blacked out something - you haven't done it this time (I believe this is a 2nd posting of the diagram). If these were ID numbers, you should black them out again and re-upload the image again. You don't have to post this comment on your site... Veraz. (panamacitybeachhotels.blogspot.com, and other sites...

    ReplyDelete
  6. Thanks Veraz - Just a verification for Yahoo - not anything of importance. I had to change location of the code so I uploaded the shot again.

    ReplyDelete
  7. Griz,
    I would love to see a post about placing affiliate ads on blogger. I have never placed an affiliate ad of any type on a blog. So, It is brand new. Is it as simple as putting generated url onto the blog? Kind of like stat counter?

    Thanks,

    ReplyDelete
  8. Thanks for the info! I always reckon that a favicon makes a site look just that bit more professional.

    ReplyDelete
  9. I can't do it!! But i think it is because i messed with the html already. I uploaded one of those templates from eblogger.com (i think thats it anyhow). I put it just before the head, can't make it work though...

    ReplyDelete
  10. Angie - did you put it right before the

    < head >

    or

    < /head >


    It should be the second one.

    ReplyDelete
  11. Grizz
    How do you get your picture nest to each post?

    I got the Favicon in the browser window but don't know how to have it show up on each post.

    ReplyDelete
  12. Grouchie,

    Damn - been a while since I did that. I'll have to look for the code and I'll slap up a post as soon as I find it.

    ReplyDelete
  13. Griz,

    How do you take all these screen shots? I tried doing this with print screen and it never comes out right. Do you have a special program that you use for your screen shots? They look so nice and I would really like to be able to replicate this on some of my posts.

    ReplyDelete
  14. Hi Grizzly,

    Thanks for this important tip! I have been looking for this for a couple of days now.. Have a nice day!

    ReplyDelete
  15. Hello Grizzly,
    thank you thank you thank you thank you. You are my new hero... :-))

    ReplyDelete
  16. Thank you so much for sharing this wonderful tip. It makes my blog looks nicer ;)

    ReplyDelete
  17. heyy, thanks for sharing..but i have problems.. i alrdy did the all steps but the icon wont change..what i must to do now? help please.. thanks so much (:

    ReplyDelete
  18. Hey there Grizzly..noticed you haven't posted here in a while maybe time to come out of Hibernation? Have you tried do add your own favicon to blogger lately..I did try your technique

    ReplyDelete
  19. Thanks a ton it has been a good help, now to add a favicon to blogger is simple and easy utilizing your advice. Kudos

    ReplyDelete

Project Payday - Work from Home

This program is for those of you who want to make money online but don't have or want a blog or website. This isn't a get rich scheme. It is a work at home job that can make you a few hundred dollars a day if you put in some effort.

I have written several posts about this and suggest you start with this one. Project Payday

Unfortunately Project Payday is only available to American users at this time. It is free to join.