Favicon is a small icon which appears at the beginning of the address bar, whenever you input the URL of a particular website. Such a website must of course posses such fav icon for you to notice it there.
Underneath, you can find some examples of favicons:
As you can see, it is a great way to make your website look different when compared with other sites. It can play a huge part in your website’s branding strategy. Others will also find your website faster when they bookmark it and store it among a number of others.
Now you might want to know how to set it up
I’ve been searching on the Web for reliable information to create and install my own favicons and as you can notice in the address bar – I managed to install it successfully:)
Here is my step by step guide how to do it
Before you start you need to have a .jpg image prepared, which will be changed into a fav icon. You can make such images using Photoshop, Paint or other similar software. You can also buy images from Istockphoto but always be sure to read their license agreement on how you can use their images. You are not allowed to use any images which represent brands of existing companies, like facebook for example.
There are also many websites on the web, where you can order such favicons to be designed accordingly to your needs and taste.
Now when you have such an image, let’s get to the next steps
1. First of all you have to make sure that the size of your image is no bigger than 150 kb, reduce it to a smaller size if it’s bigger.
2. Now go to free online software program – Favicon from Pics and upload your image.
3. Hit the button “Create Icon” and your favicon is ready to be downloaded to your computer.
4. Let’s get to the installation process:
– you can either install a wordpress FREE plugin MaxBlogPress Favicon
– or you can do it on your own, which I recommend. Why? You might have already read on my blog that too many plugins are not good at all:), so if I can do something without using a plugin I simply choose that way of doing it. So, what you need to do, is to upload your fav icon to the “public_html” folder on your server. In my case it was http://www.theinternetmarketingstrategies.com.
5. Test if your upload went well by writing in your address bar :
In my case it was http://www.theinternetmarketingstrategies.com/favicon.ico.
Congratulations if your favicon displays!
6. Now you have to put the code given below in the head section of your website. You need to put it in the header.php file of your blog and save it after that.
<link rel=”shortcut icon” href=”http://www.yourdomain.com/favicon.ico” type=”image/x-icon” />
Use the URL of your website instead of http://www.yourdomain.com
Note that there are other codes mentioned on the Web. They didn’t work in my case, except for the one mentioned above.
7. If by any chance, like me, you are using Thesis Theme, it’s even easier to install the code given above. Simply upload your Favicon image using Favicon uploader inside your Thesis options.
8. In the end after refreshing your website the favicon should appear in the address bar. In some cases it may however take a bit longer. But Patience is a Virtue:) And the more creative you are the better your result!