Joomla allows you full customization over your site’s favicon. You can create your own and upload it to the framework. We recommend doing this because it helps make your site unique while adding an aura of professionalism.
It’s relatively easy to handle favicons with Joomla, but it can get complicated if your favicon is not in the default location.
Step 1 – Create Your Image
The first step is to craft a favicon for use with your website. Bear in mind that your image must be 16 x 16 pixels, which does not give you a lot of room to work with. You can make a favicon with programs such as Photoshop, Gimp, or even Windows Paint.
An alternative is to use a browser-based tool like antifavicon.com. Remember that detail will not show up on a favicon, so simple is best.
Step 2 – Make it the Right Format
The correct format for any favicon is the ICO format. You may already have a file converter on your computer, but if not there are plenty of tools online for doing this. Some of our favourites include:
Step 3 – Move it to the Right Place
Once you have your ICO file, you have to move it to the correct location on Joomla. The file should be copied and pasted to /joomla/templates/<your template>. Change the name of the favicon to ‘favicon.ico’.
Check your browser to see if the favicon is working. If you can see your new icon, that means you’ve done everything correctly. But even if your icon hasn’t appeared, this doesn’t mean something has gone wrong.
Begin by repeatedly refreshing your browser. If this doesn’t work, try clearing your cache and Internet history.
Troubleshooting by Browser
Different browsers require a different process for refreshing and clearing the Internet history. You may be unfamiliar with how to do it correctly. Below is a guide to each browser.
- Firefox/Safari. Hold down shift and click reload.
- Internet Explorer. Hold Ctrl and click reload.
- Konqueror. Click the reload icon. No keyboard commands required.
- Opera. There’s no easy way to refresh. Your only option is to go to Tools > Preferences and completely clear your cache.
- Google Chrome. Shift and F5 will do the trick.
In some rare cases, none of this will work and you will be let scrabbling around for a solution. Your last option before simply restarting the process is to delve into your browser and delete the temporary Internet files. This should, in theory, reflect the changes made to your site.
What if Your Favicon is in a Different Location?
You may be using a template that redirects your browser to another directory or file, which would explain why your favicon isn’t appearing. It is your job to find out where your new favicon needs to be.
Go to http://yoursite.com/templates/your_template/index.php. Here, you should look for <link rel=”shortcut icon”. Here you’ll find the name of the ICO file and the directory. This is where the browser is generating its favicon from.
You need to place your icon on in this same location with the same name. As long as you set the security features in the right way, your web server will access the file.