How to add a favicon to your PHP site

After hours of trial and error, i finally managed to put a favicon for a PHP site of mine (Blogwerx). It’s an animated one, created using a trial version of Easy GIF Animator. A simple favicon would be a 16×16pixel icon image (.ico), but as long as your icon is a sqaure the size really doesn’t matter (Blogwerx icon is a 160×160 image). GIF images should also be a square. Haven’t tried uploading a rectangular image though, so I don’t know the consequence of uploading such a picture.

By default, and just to make sure everything will work our correctly, your icon should be named favicon.ico, and if you want to upload an animated image, it should be named animated_favicon1.gif. I think you can name them anyway you like, as long as the filename is indicated in the code. But then again, let’s just be on the safe side.

Loading a favicon is pretty easy once you know where to look and edit the code at. The code will be inserted at the header.php file. If you use a template for your Wordpress site, the header.php file is located inside the themes folder, which is inside the wp-content folder, which is inside the public_html folder.*

/public_html/wp-content/themes

*This directory works for the Blogwerx site. Depending on your installation, this directory may be different from yours.

Choose the folder of the theme or template that you are using. (Blogwerx uses the Fresh (Compact) design). Inside your theme directory is a folder named images. Transfer your created icon or GIF image inside the images folder (using your favorite FTP program).

If you have uploaded an icon image (.ico), the change will take effect immediately, as the code is already included in the header.php by default. By default, your favicon code inside the head and head tags looks like this:

<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon" >
<link rel="icon" href="/images/favicon.ico" type="image/x-icon">>

The first line is for an Icon favicon (.ico), while the second line is for an animated icon (.gif).

If your header.php doesn’t have these codes, or is different from the ones listed above, or you uploaded an animated favicon, manually type or edit it inside the head and head tags. Make sure the filename of the images you uploaded, and the folder where you placed them, are specified in the tags. For an animated icon, change the second code above to the code below:

<link rel="icon" href="/images/animated_favicon1.gif" type="image/x-icon" />