Favicons are the cool little symbols that are right to the left of your title in the browser bar. Favicons 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
<link rel="shortcut icon" href="favicon.ico"> anywhere between the <head> and </head> tags.
5. View your blog in the browser and hit Ctrl +F5 to hard refresh your browser. Congrats, you now have a favicon!