Do you know what a favicon is? It is a small website icon displaying on a browser’s tab and your bookmarks list as well. Moreover, it is also a small piece of customization that goes a long way.
If you want to change the favicon of your site, let follow our introduction below. We will guide you on how to change it easily. Let’s start now!
Step 1: Generate a 16×16 image. In order to do it, you can use some graphic software like Gimp, Paint.net, Windows Paint or Photoshop. An online tool is also suitable in this step such as Antifacicon.
Step 2: Using some free online sites to convert that image into icon format. Some site available are converticon.com, favicongenerator.com, htmlkit.com/services/favicon/, tools.dynamicdrive.com/favicon/,www.favicon.cc/.
Step 3: The file that you have created will have the extension.ico. Now, let copy the file to the /joomla/templates/<your template> directory and then change the name into favicon.ico.
Step 4: When you finished 3 steps above, let open a browser. If you see your new icon, congregate that you have done it successfully. If not, do not worry because it does not mean that you do something wrong. The reason may be your browsers are designed to minimize data traffic and they don’t refresh the favicon whenever they display a page. In this situation, it is necessary for you to refresh more thoroughly. Let’s try some of these ways:
- Mozilla / Firefox / Safari: hold down Shift while clicking Reload, or press Ctrl-Shift-R (Cmd-Shift-R on Apple Mac);
- Opera users may need to completely clear their cache in Tools→Preferences.
- Chrome: Shift-F5
- Konqueror: simply click the Reload button or press F5;
- IE: hold Ctrl while clicking Refresh, or press Ctrl-F5;
If you tried all 5 ways above and it still doesn’t work, you will have to remove the temporary internet files and the history. After that open your page again. You can also remove your favicon, then refresh the browser with F5 and upload the favicon.
The favicon is in another place.
There are several templates including codes that redirect the browser into another icon file or another directory. If you want to define the place for your new favicon should be, let check out the http://yoursite.com/templates/your_template/index.php and look for code including the text <link rel=”shortcut icon”. At this place, you will see the name of the icon file or the directory you need. Now, let copy your icon to that place and provide it a name that link is pointing to. You also need to ensure the security is correct so that your webserver can get access to that file. Let’s see this example below to get a clearer understanding!
In case you don’t want to just alter the favicon.ico file in its particular template directory, you are able to find the reference to the favicon.ico file in the html.php document. The path is “……..\libraries\joomla\document\html\html.php”. This should prevent the icon from toggling if you use
in the template HTML and you don’t remove the favicon.ico file. (why call the icon twice?)
From the html.php
Conclusion:
That’s all of our tutorial today. Thanks for reading! If you have any questions when you change your Site Favicon, please leave a comment below or contact us through our Contact Page and submit Ticket Support. We will try to answer you as soon as possible.
- Taking Inspiration From One of the World’s Leading Eyewear Ecommerce Sites: Eyebuydirect - March 22, 2024
- Navigating Success: The Role of UX/UI Agencies in Business Growth - March 12, 2024
- 4+ Best Woocommerce Private Store Plugins - March 8, 2024
Recent Comments