Favicon Tutorial

What is a Favicon?

Notice the red “Y!” symbol that appears in the left-most area of the address bar in Internet Explorer graphic below. Look familiar? Yep, that’s Yahoo’s favicon. These favicons (favorites icons), sometimes called “bookmark icons,” appear after adding a website with a favicon to the favorites menu in Internet Explorer and certain other browsers.

Favicon in IE address bar

Favicons also appear in the favorites menu after a page is added. Most anyone who’s roamed the Internet and bookmarked sites of interest has noticed favicons showing up in the favorites menu like this:

Favicons in favorites menu

They also often appear in the Windows Start menu after installing a program as shown here:

Favicons in Windows Start menu

Creating a Favicon

A favicon should be 16 X 16 pixels with 16 colors and the file name should be favicon.ico. IconEdit32 is a good freeware program that allows you to create favicons as well as icons of other sizes and color depths. IrfanView is an excellent freeware image viewer that supports the icon (.ico) image format. You can use it to shrink one of your regular images to a 16 X 16 size, then decrease the colors to 16 and save as a “.ico” file. I like to use IrfanView to get an image down to specifications, then edit it with IconEdit32. Remember, if you don’t save it as “favicon.ico,” it won’t work. Also, don’t just shrink an image to icon size and rename it with a “.ico” file extension. That won’t work either because it’s not a real icon file.

Installing a Favicon on your Website

Simply upload the file, favicon.ico to the root web directory of your hosted website with your favorite FTP program, Microsoft FrontPage, Dreamweaver MX or whatever. Make sure your favicon file is named “favicon.ico.” When someone bookmarks your site with a browser that supports favicons, your favicon will appear. Alternatively, you can use this code between the <head></head> (x)HTML tags:

<link rel=”shortcut icon” href=”http://www.thenameofyoursitehere.com/favicon.ico” mce_href=”http://www.thenameofyoursitehere.com/favicon.ico”/>

Where can I get Favicons?

You can feast upon Clickfire’s collection of over 100 free favicons and download them for use on your website. To find out more about favicons, visit the definitive favicon site, Favicon.com.

What good is a website without a favicon?

Absolutely worthless :)

Download Free Favicons:

Free Alphabet Favicons Alphabet Free Flag Icons Flags Free Favicons Miscellaneous Favicons Transparent Favicon Transparent

Emory Rowland

Emory Rowland is editor and keeper of the flame at Clickfire. He's a fanatical blogger, entrepreneur and builder of Internet things from way back. He's a founder of several blogs including Testimony Share, a site that encourages Christians from all over the world to write and share their testimonies (see his). Emory's love for social media and success with organic search lead him to start Leverable, a SEO consulting venture. Later, he joined a leading Atlanta search marketing agency where he currently develops SEO strategies for top online brands. Apart from the Internet, he could be considered by many as pretty worthless. More...

152 comments

  1. Pingback: IconEdit32 Review - IconEdit Icon Editor lets you Make your own Icon

  2. axcel December 16, 2007

    thanks for the favicon

  3. Pingback: Entrecard and Favicon | Beeker's Words

  4. Sandra February 26, 2008

    a favicon appears on my website…a red asterick/flower
    i did not put it there
    i did not upload it to my site
    have any ideas how it got there?
    i worry about security as this got there somehow and i did not put it there….any ideas?

  5. Emory Rowland February 26, 2008

    Sandra, it looks sort of like the Mambo flower favicon. Are you using Mambo or another content management system that might set that icon as the default?

    http://help.mamboserver.com/index.php?option=com_content&task=view&id=585&Itemid=124

  6. Ding Ding February 29, 2008

    I followed the format above to create a favicon but it is not showing up Internet Explorer. It is showing on Firefox. Can someone let me know the problem maybe?

  7. Emory Rowland February 29, 2008

    Ding Ding,
    I have noticed that sometimes it takes a while after bookmarking for the favicons to show up in Internet Explorer and sometimes they don’t show up at all. I’m not sure why this happens, but I’ve heard the complaint often from others. It really should work if you drop the favicon into your root directory. I’ve been able to get it to work on my sites so far, but sometimes it takes some tweaking.

    Here are a few suggestions to try:

    Bookmark it on another machine or ask a friend to do it and see if it shows up.

    Another method you can try is the “link rel” meta tag between the head tags of your source document. This doesn’t seem to always work, but it may be worth a try.

  8. Michael March 19, 2008

    how is it that some computers see the favicon and others do not? What’s different in their setups?

    Cheers.

  9. Emory Rowland March 19, 2008

    Michael, I believe it is more related to the browser. I have noticed that IE has trouble seeing the favicon after it has been deleted from the cache.

  10. Bob April 9, 2008

    It is not necessary for the icon to be called favicon.ico – it can have any name as long as it has the .ico extension and is correctlly referrenced. There does sometimes seem to be a problem getting it to appear. These things work well in Firefox – superior in so many ways to Internet Explorer.

  11. Q5USA April 23, 2008

    I’ve used this before and still use it. But it does show an odd inability to “stick”, and seems to vanish or take a while to appear in IE. I blame the lousy MS speghetti code, personally. If it doesn’t seem to work don’t sweat it, my advice. It’s just one line of code. How bad can you screw it up?

  12. chris April 28, 2008

    Nice overview of favicons (and blog, for that matter). I created a simple tutorial on how to create a favicon using pages (from apple iwork suite) here: http://www.cjupin.com/2008/04/28/how-to-create-a-favicon-using-pages/

  13. poemas June 9, 2008

    Thanks for the tip, i have been trying to add one to my site for a while. Nice blog!

  14. Karenality June 12, 2008

    I use Firefox. I see Favicons on some sites, your site, Yahoo, etc. They show up in my bookmarks.
    I have tried to use your code in my website.
    No matter what…I can’t get my icon to show up in my Firefox browser!!! Grrrr…Whazzup with this???
    Please HELP!
    Thanks!
    ~Karen

  15. Emory Rowland June 12, 2008

    Karenality, did you upload the file to your root directory at (www.thenameofyoursitehere).com/favicon.ico? Usually, that’s enough to do the trick with FireFox and IE.

  16. imran June 25, 2008

    hi i uploaded the favicon.ico file….to root directory but still it does not work… i also added extra lines in
    section still did’t work…any help

  17. Tommy Wilkinson July 7, 2008

    Hello thanks for your help!! I dont know if you still update this but I’m having problems. I posted my .ico file on my hosting site in the proper directory. when i type in “www.shinemediahouse.com/favicon.ico” the ico comes up okay but it is not loading as the favicon for index.html on IE or firefox.

    Can you try and see if it is working for you? I also added that code so im not sure what the problem is.

    Thanks for your time!!!

  18. Emory Rowland July 7, 2008

    Hi Tommy, I checked your site in both IE and Firefox and I am seeing your favicon just fine. Looks like you’re okay.

  19. Tommy Wilkinson July 7, 2008

    Thank you so much for checking for me in such a timely manner! Just a question though. Does it look okay or is the icon muddy looking? And why can you see it and i cant?

    Thanks for your time!

  20. Emory Rowland July 7, 2008

    No problem, Tommy, glad to help. It looks normal to me. I’ve noticed that sometimes when I delete a site from favorites in IE that it doesn’t seem to want to come back and show up in the browser address bar again. Not sure exactly why that happens though.

  21. Vicki July 20, 2008

    I am having troubles with IE. I have uploaded the image I want to my root web, added the code to my head but still doesn’t show up in IE. I checked my website millingtonseed.com on foxfire and the favicon is there but still will not show up on IE. Anyone have a clue as to what I need to do. I really would like to have my cute little flower show up on all the browsers. Thanks in advance. :)

  22. Emory Rowland July 20, 2008

    Vicki, it’s in the right location, size and format seem right. Could it be the colors? Looks like 256+.

  23. Vicki July 26, 2008

    Thanks Emory, I changed the colors to 16 hope it works.

  24. john August 7, 2008

    Hi,
    For those where the favicon doesn’t appear here;
    delete your browsing history in IE and then you will see the icon!

  25. Melia August 8, 2008

    I am trying to make my own blog, I have a problem with favicon… it appear in firefox, but can not seen in I.E.
    then I check your web, it is also the same problem, your favicon is not appeared in I.E. what’s the problem? I have followed all guidances… still have same problem.

    Thanks a lot.

  26. Vicki August 8, 2008

    Thanks John,

    I can see my favicon now. :)

  27. Ashutosh August 23, 2008

    I dedicated a website on favicon, whatisafavicon.com. As we share the same interest would like you to review the site and suggest me on making it better. Thanks Ashutosh.

  28. Declan August 29, 2008

    Hi all. OK. I’ve generated my favicon.ico file, have uploaded it to root directory with CuteFTP and voila! Nothing! On any browser. What’s happened, any ideas. Generated the icon using a plugin for Photoshop. Think I’ve done everything correctly. Help pleeeeeeze!

  29. Ashutosh August 30, 2008

    Declan – did you copy the html code? Copy paste the code below in ur page below

    For example…

    whatisafavicon.com/icreate.html and delete all the temp files before reloading the page.

  30. Declan September 1, 2008

    Ashutosh, thanks for that. It seems to work fine now in Firefox but now it’s not showing up in Safari – any ideas/suggestions?
    Cheers,
    Declan

  31. Ashutosh September 1, 2008

    Declan, its working at my end even on Safari. Try on latest one.. Hope it will work.

  32. Col September 12, 2008

    In IE7 and Opera 9.52, simply putting a favicon.ico in my site’s root directory makes that same favicon show up in the address bar, tab, and bookmark for every page on my domain, and even image files.
    For the favicon to show up in Firefox2, I also need to use the code in the tag and then of course it only shows up for the page its coded into.

    Given that difference, how would one achieve different favicons for different pages (I don’t like every single thing on my site having the same icon)?

    For FF, I’d need to put each favicon.ico I want to use in the appropriate directory, then add the code to the head tag of each page for it. But doing that, wouldn’t that cause a conflict in IE and Opera which are automatically using the favicon.iso located in the root?

  33. Alessandro December 31, 2008

    Hey there, I uploaded a favicon.ico to my root directory. The icon shows up when using safari, but does not when using firefox1 any ideas?

  34. Emory Rowland December 31, 2008

    Alessandro, its usually because of the favicon specs not being exactly right (size, color, file type, etc) or due to browsing caching. Do you have a link to the favicon.ico you can post?

  35. Alessandro December 31, 2008

    Hey Emory,

    the link to the favicon is cincinnatusblog.com/favicon.ico

    It is 16×16… but now that u mention it, i do not think that i put it in web safe colors… I believe i brought it out as a .gif (via Photoshop basic save for web conversion).

    where have i gone wrong?

  36. Emory Rowland December 31, 2008

    Alessandro, I believe the file format is actually jpg. The extension is .ico but it needs to be saved in the true format. You can do that with IrfanView.com free grahics viewer if needed. Make sense?

  37. Daniel N. Lang January 8, 2009

    Hey, wonderful HOWTO! I’ve immediately created an url icon for my website, something I wanted to do for a long time already. Thanks and check it out.

    BTW: Mine is much nicer than the Yahoo icon! :-P

  38. Javier Marquez January 10, 2009

    The problem with non .ico for favicon files is that IE 6 can’t read them, and 20% of people still use IE6 (what a shame), so that people won’t be able to watch your favicon.

    Current versions of browser can read the most typical image formats: png, jpeg…..

  39. Windows7Arena.com January 25, 2009

    Hi thank you for the tutorial !

  40. Sharla January 30, 2009

    Hi. Thanks so much for this tutorial! I had a weird question. I made my favicon and posted it and it was visible a few days ago but now I can’t see it. But everyone else still can. Do you have any advice?

  41. Emory Rowland January 30, 2009

    Hi Sharla, that has happened to me before. I believe it occured after deleting a the favorite in IE. It seems to delete if from the cache somehow. It might come back if you bookmark it again.

  42. Edward February 9, 2009

    I am using PHP what coding would i need to use and where should I put it? Cheers

  43. steve February 27, 2009

    I have the same question as Edward

    I have had no problems with favicons on other sites I’ve worked on in html but this is my first php site..
    plz help if you can
    thanks

  44. Emory Rowland February 27, 2009

    Edward and steve, most browsers will display the favicon if you just drop it in the root directory. At least, current FF and IE are doing that for me now as I test.

  45. Michele March 1, 2009

    Hi
    I’m having problems with my favicon showing upon interent explorer. It shows up on Fire Fox and the code you show here is the first I’ve seen that code.
    So I wonder if you could look at my site and see if my tags are correct. I’ve been told they are.

    OH Please I’ve been searching the net this whole week trying to get help on this problem and no has responded to me.

    Hope you can help
    Thanks
    Michele

  46. Emory Rowland March 2, 2009

    Michelle, you can post your site here and someone may be able to offer a solution. What’s the Website address?

  47. Claude Pechabaden April 7, 2009

    I have found Vicki’s question and answer mostly interesting, because I have done everything else listed on this site (and on other favicon tutorials) to find out why my favicon shows on Firefox but not on IE.
    Emory Rowland answered something back to her which seemed obscure but seemed to be what was possibly wrong with mine, as I did the icon in Photoshop and saved it using the plug-in but didn’t check the 16 colours or 256 bit thing. What does that all mean?
    I have done anotehr icon using the photoshop icon making thing this time (rather than just resizing) but I don’t know how I have done it wrong again, but it still won’t show on IE and I have refreshed and taken off cache and put interrogation marks at the end of the address and allsorts…
    Can someone help me, please? My site is doucepresence.co.uk

  48. Claude Pechabaden April 7, 2009

    My favicon doesn’t show on IE but does on Firefox.

    Emery R said something to Vikki which was very interesting and could be the reason why my favicon doesn’t work, he 256 bit and the 16 bit which I don’t understand (even though I have the plugin on Photoshop for the Favicon)
    I have added “link rel” and all sorts of things in the He had of the html.
    Can someone help me, please? My site is doucepresence.co.uk

  49. claude April 7, 2009

    I don’t know what I have done or not done but… it is working. For now.

  50. Pingback: Make Your Own Favorites Icon - Gadgetwise Blog - NYTimes.com

  51. games April 12, 2009

    Thanks to the information on this site I finally got my first favicon :-)

    greetings from Kansas!

  52. RPGabriel April 17, 2009

    I can see the favicon, but I can’t see the rest of the page except the background. I put the favicon on the default page only, for now. Will putting it on all the page correct that problem?

  53. RPGabriel April 17, 2009

    Problem solved!

    I went through Dreamweaver to put the favicon up. It put the code in the wrong place and added an extra something where it should have been. I’m typing the code in by hand this time.

  54. RyanB April 20, 2009

    “Also, don’t just shrink an image to icon size and rename it with a “.ico” file extension. That won’t work either because it’s not a real icon file.”

    This is absolutely incorrect. Save your file as a JPG, rename as .ico, upload as favicon.ico and it will work fine. This is by far the easiest way to make a favicon.

  55. Prasoon April 29, 2009

    Easy way 2 get favicon in your page.

    Page Title

  56. leechon May 7, 2009

    Wat does upload to root web directory of your hosted website??

    May I know how to upload that??

    Thanks

  57. Emory Rowland May 8, 2009

    leechon, it just means to place the file in your top level folder of your website like (http://www.clickfire.com)

  58. sunny May 10, 2009

    re: Firefox
    my favicon is in the root directory and shows up fine on the home page but none of the sub pages. even tried copying the code to the sub pages but no go.

    favicon shows up fine on all pages in Safari and IE (needed additional code for IE)

    any ideas?

  59. sunny May 10, 2009

    correction: some sub-pages now seem to work, but not all.
    seems unpredictable.

    again, any thoughts?
    :-)

  60. Emory Rowland May 10, 2009

    sunny, do you have an example of a URL that’s not showing the favicon?

  61. sunny May 11, 2009

    (http://student106.tangostudents.com/sub_pg_3.html)

    now this seems to be the only one that doesn’t work.
    yesterday there were 3…like a moving mystery.

  62. Emory Rowland May 11, 2009

    sunny, I am seeing it fine on the page you listed above in FF, IE, and Safari. Maybe it’s a caching issue.

  63. sunny May 12, 2009

    hmmmm…
    could be.

    thanks very much.

  64. J. L. May 14, 2009

    There is a website called IconDrive.com (http://www.icondrive.com) that allows you to advertise your website with your favicon.

  65. Genius May 15, 2009

    Dear All,

    Please help me to advise for “add favicon on my site” .I am using php script and I can not find header.php or any other HTML pages.Where do I add source code of favicon.ico?Any help please?!!!

    Thanks
    Genius

  66. Emory Rowland May 16, 2009

    Did you upload favicon.ico to the root directory?

  67. Julianne May 21, 2009

    Hi everyone, I used Yahoo SiteBuilder to create a website for my friends company, but can not for the life of me figure out how to get a favicon going. I have the favicon and saved it .ico using Irfanview. Is anyone familiar with SiteBuilder? Can anyone help?

    Thank you so much!
    Julianne

  68. Pit Bull Lvr June 2, 2009

    Whats the root directory?

  69. Emory Rowland June 2, 2009

    That refers to just the top level directory or yourdomainname.com.

  70. Digital Froilan June 19, 2009

    Thanks for the info I tried uploading a favicon on my site and it does not show on Internet Explorer. On Firefox it shows up just fine.

  71. jc August 5, 2009

    i can see my favicon in all browsers except firefox. Are favicons sensitive to different browsers and/or bowsers versions?

  72. Emory Rowland August 5, 2009

    jc, in a perfect world, the favicon should show up in all browsers but often there is one that doesn’t display it. Usually it seems to be older versions of IE that have trouble, not FireFox.

  73. BG September 30, 2009

    Hi there! I need help. I’ve just created my favicon but it only show in Firefox and not IE. I’m not very sure what is wrong with that and I’ve also get a few friends to try on their PC but none seems to see it.

    Can any let me know where else can I find my mistake? Please advise.

  74. Subtitulos October 9, 2009

    Best favicon tutorial I’ve ever read, nice!!!

  75. ashraffkalbani November 10, 2009

    i am from zanzibar i like this tutorial thanks.

  76. ukinternetshop November 18, 2009

    As a guy called John said back in August 7th, 2008
    Hi,
    For those where the favicon doesn’t appear here;
    delete your browsing history in IE and then you will see the icon!

    This works perfect.

    Many thanks.

  77. Tam November 20, 2009

    Hi,

    I am trying to upload my favicon onto my Ning.com network. I did everything right and converted my picture to favicon.ico and uploaded it under the “Set Favicon” location. Yet, nothing! I don’t know what I’m doing wrong. Please help..

  78. Emory Rowland November 20, 2009

    Tam, I can see your favicon when linking directly to the file. I believe that the file is much greater than 16 colors.

  79. pat March 6, 2010

    last night I added the favicon picture. it worked great in firefox but in IE it kept giving me an annoying pop up box to add as my favorite. I didnt want the pop up since I have 160 links on my webpage. I removed it from my webpage & reloaded it & it is still there online. I cant get rid of if. I deleted brower cache & history etc. Do I have to wait for IE to update their brower or what ?

  80. Leah March 9, 2010

    Hi, I’ve read through all the comments and have looked into every solution, but nothing has helped resolve my problem. I’m able to see my favicon in Safari, but not in Internet Explorer and Firefox.

    My website is www2.uic.edu/%7Eltran24/bvis415/. Does anyone have a clue in what could be wrong?

    I appreciate it!

  81. Leah March 11, 2010

    The file is definitely there. Are you still not seeing it? I feel as if I’m missing something extremely simple!

  82. Emory Rowland March 11, 2010

    Yeah, when I go to this link, I see a broken image in my browser. Do you? http://www2.uic.edu/~ltran24/bvis415/favicon.ico

  83. Leah March 11, 2010

    When I’m in Safari and I click on my website link, I see my favicon image. When I’m on Firefox, I see it as a broken image also. That’s strange. Any clues on why that is?

  84. Emory Rowland March 11, 2010

    Interesting. I see the question mark in my Safari. Are you sure the favicon.ico file is in the bvis415 directory?

  85. Leah March 11, 2010

    Hey Emory, I got it to work! Thank you for your patience. This was a really easy tutorial–but as I had thought, it WAS just a matter of overlooking something simple on my part. I thought I had my favicon set up with 16 bit color, but it was much higher than that. Once I altered it, everything worked out. I appreciate it!

    • Emory Rowland March 11, 2010

      I see it now. Congrats, Leah! It looks great. Glad I could help.

  86. Leah March 16, 2010

    Hi, Leah again.

    I have another problem. I recently switched my website from my school’s domain to my very own (www.leahtran.com) and I can’t see my favicon anymore. Is this something I have to ask the people I bought my domain from or would you be able to help me figure this out? Thanks!

    • Emory Rowland March 16, 2010

      Hi Leah, Congrats on getting your domain going. I see a favicon.ico file there at http://www.leahtran.com/favicon.ico but it doesn’t show up in my IE or FF. It looks like it could be too many colors again. Looks like it’s a lot more than 16.

  87. Emory Rowland March 17, 2010

    Leah, another possibility is that it’s not working because your site is using frames to pull in the content from your school’s site.

  88. Leah March 19, 2010

    Hi, thanks Emory! Yes I think the second possibility is it. I’ve tried remaking my favicon a couple times and was frustrated when they didn’t work. I’m noticing that the frames aren’t in the tags and I’m not sure how to change that until I eventually get my own webhost or ftp program. Thanks for the speedy reply and helping me figure out whats wrong!

    • Emory Rowland March 21, 2010

      Your welcome, Leah. Feel free to post back in the future.

  89. mkcycles April 13, 2010

    IE – If you don’t see your favicon at first, try deleting temp files, history and cookies with IE tools. After several attempts I did this and all is good!

  90. putt putt April 30, 2010

    I cannot get the favicon to show on my newly created Ning site..I had no problems with the other ones I created. I used a protocol I found online and now I cannot find it again.

    Anybody know how I can create one? again? I thought I did but NING says it has to be ISO,phooey!

  91. Sydney BG May 23, 2010

    I’ve learned a lot of great info here but I need help with getting my favicon to show on a site built with WordPress software. It is at http://www.timeforchi.com. I made a nice little icon that I can see at http://www.timeforchi.com/favicon.ico, but it doesn’t show at the site and I’m not sure if it is because I didn’t know where to put the code. There is a header.php that has a but the index.php doesn’t. Also there are more than one index.php; one in the theme that I use, that runs the site, and another couple that I don’t mess with on higher levels of WordPress in my root folder. I would appreciate any help as I’m sure I’ll be doing more WP sites. Thanks.

  92. Sydney BG May 24, 2010

    Okay, it’s working, so . . . I must have done something right. I didn’t check in IE, but I’m always afraid to look at any site I work on in IE. Just stick with Firefox and keep your fingers crossed for everything else.

  93. Umesh Upreti May 28, 2010

    Is it necessary to be 16 bit color or it can be higher one?

    • Emory Rowland May 29, 2010

      Umesh, I have noticed that many browsers will display higher resolutions, now. This would be something good to test.

  94. Anthony May 28, 2010

    I’m confused, I changed my picture to a favicon but it only displays on that image page, not the entire site. I see the icon here: mastertoons.com/favicon.ico but not on my site. Any ideas why?

    • Emory Rowland May 29, 2010

      I’m seeing it fine in IE and FF, Anthony.

  95. Kester Taylor May 29, 2010

    Hey, just thought I’d drop by and first of all, say thanks for the tutorial. Second, though, I wanted to let people know a problem I had and how I fixed it, since I’ve seen a few vaguely similar ones, and just in case someone else has one like it.

    For awhile, I was able to get my favicon to work but ONLY on the main page and ONLY if I hosted the file elsewhere. I couldn’t figure out how to get it to correctly reference the one in the directory, much less for my other blog entry pages to reference it at all.

    What I ended up having to do was just change the permissions on the favicon file to 755 so those other pages could execute it.

    Anyway, just thought I’d let you guys know in case anyone else had a similar problem. Peace.

    -k

  96. Anthony May 29, 2010

    Thanks guys, I guess for whatever reason it takes a little while for it to appear on all the other pages because it wasn’t working last night.

  97. Angelo July 3, 2010

    Hi, I want to make a fav icons for my site (www.salami.com). I want it to be animated like this site: extendedheightlimits.com. Please help me.

  98. the money paradise October 1, 2010

    thanks for the article. i tries to apply it to my blog but it is no showing. can you please help me?

  99. Emory Rowland October 1, 2010

    I am not sure if you can upload a favicon to blogspot. I suspect not. Anyone know?

  100. iTao October 25, 2010

    Emory, Im not sure if you can, and i only read a few of the comments, but for favicons to show, you sometimes need to clear your browsing history and i suggest you are not on the site that is having troubles with displaying the icon, as sometimes it could say no icon still, also after clearing browsing history (tools tab above) close your browser and re-open it and go to the site, this sometimes help’s to get the favicon displaying… :)

  101. Cynthia December 7, 2010

    My favicon does work with foxfire. It appears with IE. I use Microsoft Publisher to do my site. Any ideas on how to get it to appear with Foxfire?

  102. Cynthia December 7, 2010

    Sorry I meant to say it doesn’t work with Foxfire can anyone help!

  103. Sylvia January 20, 2011

    I am the webeditor for our school site and I have been trying to add a favicon to it. I use Frontpage to edit the site and it is hosted by hostek.com. I have created the favicon and named it favicon.ico. I have also put it in several folders in my web site directory but I still can’t seem to get it to work. Can someone please help me.

    • Emory Rowland January 20, 2011

      Sylvia, I don’t think you want to put it in folders but the root directory. There is no favicon.ico file in your root directory that I can see at grenadamiddleschool.org/favicon.ico.

  104. Sylvia January 21, 2011

    I am extremely new to this…less than a month. And I know this might sound like a stupid question to you but, how do I find the root directory?

    • Emory Rowland January 21, 2011

      Slyvia, the root is just the top level in the hierarchy where all the directories or folders appear. grenadamiddleschool.org/ is your root and the favicon.ico file should be within it so the path is grenadamiddleschool.org/favicon.ico. Does that help?

  105. Sylvia January 21, 2011

    I’m not sure. I emailed Hostek about it and they just emailed me a site that has tips on how to create one. I’m not sure they know how to do it either.
    But anyway…
    In Frontpage where it list everything that is in the site I see the favicon picture. The name is favicon.ico.jpg, the title is favicon.ico, and the file type is jpg.

    • Emory Rowland January 21, 2011

      Just rename the file favicon.ico by taking off the “.jpg” and that should fix it.

  106. Sylvia January 21, 2011

    I think I have the favicon saved correctly now. And I copied that link and pasted it where it is supposed to be and typed the website address in the appropriate spots but it is still not shoping up at the top in the address bar in IE.
    This is what I have typed in the index page of the site…

    And its right under the tag

    • Emory Rowland January 21, 2011

      I see the file but it is not showing in ie for me either. Did you save it in the “.ico” format? It looks like a jpeg.

  107. Sylvia January 21, 2011

    Sorry…it didn’t copy and paste over.

    “”

    and its under the “” tag

  108. Sylvia January 21, 2011

    The filename & title are favicon.ico

    • Emory Rowland January 21, 2011

      Did you save the file in the .ico format or did you rename a jpg to .ico?

  109. Sylvia January 21, 2011

    It started out as a jpeg and then I made it a 16X16 pixel picture and saved it as a .ico.

  110. Sylvia January 21, 2011

    I am seeing it in firefox but not in IE.

    • Emory Rowland January 21, 2011

      I just downloaded your favicon and saw this:
      1. the color depth is 16+ million instead of 16 or 256
      2. file format is jpeg instead of ico
      3. size is 16×10 instead of 16×16

  111. ptah January 22, 2011

    Thanks for the snippet of code. I have one site with Bluehost and the favicon works fine. Added a second domain and favicon file was not recognized. Added the code and it worked.

  112. Sylvia January 26, 2011

    I think I have the size and filename right now. How do I change the color depth?

    • Emory Rowland January 26, 2011

      I use a program called Irfanview (irfanview.com)

  113. Sylvia January 26, 2011

    I downloaded the program. Can you open a jpeg image and edit it to make it the right specs or do you have to create a new image from it?

    • Emory Rowland January 26, 2011

      You can edit the number of colors by going to image > increase/decrease color depth. I suggest checking out the FAQ on Irfanview.com.

  114. Sylvia January 27, 2011

    I’m pretty sure I have it right now. It shows in the address bar when I type in grenadamiddleschool.org/favicon.ico but it doesn’t show up in the address bar when I just type in our address…grenadamiddleschool.org

  115. Sylvia January 27, 2011

    Nevermind…It was delayed. I finally did it!! Thank you so much for the help. By the way…I found using photshop was easier. I just installed the plugin for the icon extention in photoshop.

    • Emory Rowland January 27, 2011

      You’re welcome and congrats! I see it in Internet Explorer, Firefox, Flock and Chrome. Enjoy.

  116. Lissa January 29, 2011

    OMG it’s there, must have been delayed, YAY!

    grrr, they didn’t show up in my message! lol

    And some background.. I used the coverter at html-kit.com and used several different codes to get it to work.. none did.

    and

    and

    I use Firefox and I can’t see mine in the address bar. Here is the site: plasticcanvascreations.com and here is the icon: plasticcanvascreations.com/grid.ico

  117. ajay March 3, 2011

    thank u for ur instructions.
    really it helped a lot.
    thanx!!!

  118. flux March 5, 2011

    hello, I am trying to place a favicon on my free domain name
    and its linked with other portal website. Since its linked with portal websites, I did not have a place to store my favicon to direct to my domain name. Although I did managed to
    open a freewebspace, and decided to enter the favicon URL from this new freewebspace I just opened. I think I entered the correct URL to direct where my favicon is placed, but for some reason its not showing at all. Previously I placed my own favicon at my friend’s web space, but now that I can not use anymore, I opened up a freewebspace, but just not activating. IF I directly upload the favicon to the freewebspace File manager, would it not work? dunno why its not working, cause it worked ok with my friend’s web host.
    I wonder its cause I don’t have a actual website yet.
    if anyone has an idea would appreciate your tips. cheers.

    • Emory Rowland March 5, 2011

      Do you have domain hosting at freewebspace? If so, I would think you could upload the favicon to your root directory and it would appear.

  119. lisa March 19, 2011

    thanks for the tutorial!
    it works on my website if i don’t use the www. But with the www (which i think most people use & all my links are set to) it doesn’t work. i tried with and without the line of code.
    Any solutions?

    • Emory Rowland March 19, 2011

      Hmm… I see it with and without www in IE and FF.

  120. lisa March 19, 2011

    that’s so strange. i’m on a mac in firefox. could it be a mac issue? if so, is there a line of code to fix it for macs?

  121. Emory Rowland March 19, 2011

    The only thing I see that looks strange is some extra characters showing up in your “link rel” meta tag. You may want to check that.

  122. lisa March 19, 2011

    i saw that when i went to page source – but when i open the html file in my file manager those characters weren’t there and it looked like it should. what would be adding them?

  123. Emory Rowland March 19, 2011

    Just use the link rel example code above and change the domain part to yours.

  124. If you’ve uploaded the favicon.ico file and it’s not showing up, even after multiple cache dumps, try deleting it completely from your root folder. Then type in the path into the url, ex. yoursite.com/favicon.ico

    It should show nothing found. Upload the file again and hit refresh. Your new favicon image should appear and now be showing in the url bar.

  125. sumanta parida April 14, 2011

    Shows favicon in all Browsers But explorer not showing favicon

  126. Mike April 21, 2011

    Hi, it worked but took little while to show only when i open the page source code. haven’t try the header code placement, but so far so good you info is great and enriching, thanks.

  127. Cat April 21, 2011

    Hi
    Have followed the instructions and can not get it to work – though I am a newbie at all of this. I have added the text to my template and have uploaded the ice file into my images directory. Am using Safari…

  128. Emory Rowland April 21, 2011

    Cat, you need to upload the image to the root, not the images directory.

  129. Charles Mitchell August 9, 2011

    I would like to show you how to install a favicon in the browser, email me @ faithhope2[at]sbcgloabl[dot]net I have the answer to this long lasting problem.

  130. jerry holmes November 18, 2011

    This site has helped me out and I was wanting to put favicon on my site so now I know how and soon you can see it. Thanks

  131. Ram November 30, 2011

    Hi all even a 20×20 image with .png extension also be used as favicon.

  132. Richard Winters January 30, 2012

    I have had my favicon on my site, but I recently registered an ssl certificate, and when I go to the secure url (https instead of http) my favicon doesnt show up. Is this a known issue with a fix for it? Thanks

    • Emory Rowland January 30, 2012

      Richard, I can see it ok with https. Maybe it’s something specific to your browser or cache.

  133. Richard Winters January 30, 2012

    You’re right, I cleared the ie cache and it popped right up. Sorry to have troubled you with that question! Do you have any tutorials on working with ssl? I’ve been rebuilding my site, and decided to erase my whole login system and start over with openID login. It’s really nice and all, but its on the main page… in fact its in the header and that header follows you everywhere. My question is making that login secure when it has to be, and not when it doesnt need to be. The catch is I don’t want to make a person have to load another page to login. The whole login as well as the header itself contains a bit of ajax, not just php. so in essence, any page could require ssl, because you could log in from any page.. Thanks if you can help!

    • Emory Rowland January 30, 2012

      Good, you got it working. I don’t have any ssl tutorials and couldn’t seem to find one I liked elsewhere. If you find a good one, feel free to post back here.

      Yeah, I think an ajax login that keeps the user on the page is MUCH better for usability.

Leave a comment