Amazon.com Widgets

How do I add a favicon?

Written by Malin on June 22, 2007 – 7:39 pm -

Some people have sent me this little question over email so I thought I could answer it in my blog…
There are several ways to add a favicon to your site, and I’ll cover two of them here!

Option one - The easy way

  • Create an image in your favorite image program or choose one you already have, just make sure it isn’t too big cause then it won’t look very nice…
  • Go to Chami.com’s FavIcon from Pics-service.
  • Browse and Generate.
  • The service will show you one non-animated and one animated favicon. Then follow the instructions on the site…

Option two - The trickier way (Well no, it’s not trickier than the other way actually)

  • Download the Windows Icon (ICO) file format Photoshop Plugin (if your Photoshop doesn’t already support .ico formats) and install it. Instrictions can be found at the download page.
  • Create an 16×16px image (since it’s quite small you can start with 50×50 and then resize it) and save it as “favicon” and don’t forget to choose “Windows Icon (ICO)” in the format field before you save it!
  • Upload the favicon.ico to your site (root perhaps?).
  • Add this line to your header - between the <head>-tags (or every page where you want the icon to appear):
    <link rel="shortcut icon" href="/favicon.ico" />
  • Save and upload. Test it out. If it doesn’t work, try refreshing the page…

Posted in General |
Related Posts
  1. 1 Trackback(s)

  2. Sep 23, 2007: How to add a favicon to your Blogger blog | Cactuus

Post a Comment


Warning: array_rand() [function.array-rand]: Second argument has to be between 1 and the number of elements in the array in /home/blogging/public_html/blog/wp-content/plugins/math-comment-spam-protection/math-comment-spam-protection.classes.php on line 71