Category Archives:

How to put a Favicon in WordPress Blog

Sunday, February 10th, 2008
Posted in Web Design by Joel Gross

Favicons are the cool little symbols that are right to the left of your title in the browser bar. Favicons in your bookmarksFavicons are also used in the bookmarks section of your web browser (see left side image). For example, the black circle with a white U to the left of the Underdog Sports Leagues name is a favicon. Favicons help users quickly glance through their bookmarks to find your site. The other two links in the bookmarks section are hard to differentiate between because they lack a favicon. I recently added a favicon to my site (the black J connected with the X on a white background).

How to make a favicon:

1. Create a roughly square image containing the visual elements you want to appear in your Favicon. To design a good favicon, I recommend using simple elements that are easily recognizable such as a letter or two with a unique color. You can also take someone else’s favicon (criminal! ;)) by simply typing in their url and adding /favicon to the end of it (steal mine by typing in joelx.com/favicon) and then right clicking the image and saving it.

2. Go to this site and upload your image and convert it to the .ico favicon format. Next download it to your computer. You now have a favicon!

Below I have listed 5 simple steps to putting a favicon on your WordPress blog:

1. Create or download a favicon.ico file.
2. Upload your favicon file to your blog using an FTP client. Place it inside the initial public_html folder, not inside one of the blog subdirectories like /wp-includes.
3. Check to make sure you placed your favicon in the correct directory by typing in your-url.com/favicon.ico. If you see your favicon image you did it correctly.
4. Go into your WordPress admin panel and click Presentation, then Theme Editor and on the right hand side click on header.php to open your editing window. Add the following code anywhere between the and tags.
5. View your blog in the browser and hit Ctrl +F5 to hard refresh your browser. Congrats, you now have a favicon!

6 thoughts on “How to put a Favicon in WordPress Blog

  1. thanks bro…your info is very useful..unfortunately my favicon only appear at homepage but not on other sub pages…can you help me solve this problem…

  2. Hey, I’ve been trying to get a separate favicon for one of my subdirectories- you don’t by any chance have a clue as to how to go about it, do you? O.o

  3. Nice write up…usually I never reply to these thing but this time I will,Thanks for the great info.

Comments are closed.