Jun 14
Favicon - how to
You know when you load a URL and there is a little image in the address bar? Have you ever wondered how that gets there, and how you could have one for your page? Wonder no more!
It’s called a favicon, and it’s actually really simple to do. You just need a little html coding nous.
- Create an image that is 16×16 pixels. I just use Paint for mine, as it was really easy.
- Save the file as favicon.ico (ico is a file extension).
- Use your ftp program to upload favicon.ico to your root directory - e.g. for this site, I whacked it straight into the womanvsweb folder.
- Go into your web page (in WordPress this is under Design/Theme Editor in your Dashboard) open the header.php file or your index file and insert the following code: <LINK REL=”SHORTCUT ICON”
HREF=”/~your_directory/favicon.ico”> - This code should go immediately before the </head> tag
- Replace /~your_directory/ with the URL of your site, e.g. http://womanvsweb.com/ NOTE: I found that if I put the www. before my website name in the link it didn’t work - experiment to see which works for you.
- Reload your page, and you should see your little icon pop up in the address bar!
It gives your site that little edge - wow, they know how to do that? They must be an expert…
For a more in-depth explanation, have a look here. I tried a few other methods, but this was the one that actually worked for me!




Thanks! I was getting hung up on getting my favicon working because I was leaving the http://www. before my website name in step six. My guess is that this peculiarity has something to do with Dreamhost, since we’re hosting there.
30 Jun 08 at 9:35 am #Glad to help, Jason - it was driving me crazy before I figured it out!!