Joomla tutorial: How to create and use a Favicon in Joomla

A favicon is a small 16x16 pixel icon that shows up in the browser address bar and in bookmarks to a site. You can see an example of this here at

Here, I'll show you how to create and implement a favicon on your Joomla site.


Using a favicon file will make it easier for your users to recognize your site in their bookmarks list, their multiple browser tabs etc. It's a service to your site visitors, and a nice visual addition to the overall impression of a site.

Creating the favicon file

A favicon file is an image file saved in a special format, called .ICO. A favicon file is normally named favicon.ico, but it may be named anything you like, as long as it ends with .ico. If your image editing software doesn't support the ICO format, the easiest way to create a favicon file is to use an Online Favicon generator.

Linking to the favicon file

When you have downloaded the file, you should upload it to your site image folder.

It might be that your template already uses a favicon. In that case, you need to find out where the image file is located. Normally it's located either at the site root, or in the /images folder. This depends on the template.

For instance, in the standard Joomla template JA Purity (ja_purity), the favicon is located at the root level of the template, i.e. /templates/ja_purity/favicon.ico

To find the location of the favicon file, look at the source code of your page and search for the phrase ".ico". You should find something like this:

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

If the template you have does not have a favicon, you can upload the file to wherever you like on your site (for instance in the images-folder) and use the above code with modifications reflecting your choice.

For instance:

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

Add this code to your template index.php file (in the head section) and you're good to go.

Good luck on implementing your favicon!

Read 23401 times Originally published on Sunday, 24 May 2009 01:00
Last modified on Monday, 27 June 2011 10:22
comments powered by Disqus