homecontact


News

Inserting a Favicon

Creating an Icon

Favicon's is the term given to the icons which you see when you save a webpage to your favorites. Also with the new browsers it also shows at the top right hand side of the address bar.

 

Favicon

 

Using an image editing software such as photoshop create a BMP 16 pixels by 16 pixels. You can make the image however you want but remember try and make text stand out as it's only a very small image. With this saved you then need an icon editor.

There are lots of icon editors, one that i used which is free is Irfanview. Once you have Irfanview, open your BMP which you saved and go Image: Decrease Color Depth and change it to 16 colors.

Save your icon now as favicon, as a ico file type. It has got to be that filename otherwise the browsers won't recognize it.

Upload your icon to your site root folder.

Setting favicon code

The code needs to applied just underneath the title tag. Make sure that the reference to the image is absolute and not relevant.
This code can be applied to your template and it will automatically apply to all of your pages.

<html>
<head>
<title>Page Title!</title>
<link rel="shortcut icon" href="/favicon.ico">
</head>
<body>
Content
</body>
</html>

If you don't see icon in your browser try deleting your internet files, close your browser and try again.

Back to Top