How to Add a Favicon to Your Joomla Website

Everyone loves favicons, they imply professionalism, seriousness, and continuity of the website and the underlying business (Note: itoctopus still doesn’t have a favicon because we are still working on our corporate identity).

As such, a lot of our Joomla customers want to know the procedure for adding a favorite icon (aka favicon) to their website. Although we’re not designers, we can help answering this question because we’ve done it many times already, and it is very easy.

Here’s how:

• Create a 16×16 pixel image in Photoshop (note: You can also create create a 32×32 or 48×48 pixel images – but the most common and readable format is 16×16)
• Save the image as favicon.ico (To be able to save icon images in Photoshop, you need to install this extension). Note that nowadays the majority of browsers, such as Firefox, Chrome, and Opera can read icons that are gif images (so you save the file as gif, to “favicon.gif”, and then you rename the file to “favicon.ico”).
• Upload the favicon.ico to the root directory of your website.
• That’s it!

What if it doesn’t work?

• Ensure that you’ve created the favicon.ico in the proper format (right image type and right size).
• Ensure the following line: <link rel="shortcut icon" href="http://www.yourjoomlawebsite.com/favicon.ico"/> exists under the head section of your HTML code.
• Ensure that you’ve uploaded the favicon.ico to the right place.
• Wait a bit, this is because some browsers, such as Firefox, cache the favorite icon for a while, so even after you change your favicon, it might take some time for your changes to appear on the browser. Try visiting the website with another browser that you don’t usually use to see if your changes worked (e.g. you can see the favorite icon).

If you’re still having problems with making your favicon.ico appear on your website, then please contact us. As always, we’ll be glad to help!