How-To Categories
Recent How-To's
News Feed E-mail
Login
| How to change your favicon |
|
|
|
| Written by Cory | |
| Tuesday, 08 May 2007 | |
|
The word "favicon" is short for "favorites icon", and it is the 16x16-pixel icon that is associated with your website and appears in the browser address bar and favorites menu (and in Firefox and Internet Explorer 7, it also appears on the browser tab). For this website, I am using the default Joomla! favicon because this site is a site about Joomla! The image below shows what your browser's address bar should look like when visiting this site.
All Joomla! installations come with that favicon installed, and a common mistake by many webmasters is to ignore the favicon, thereby keeping the default Joomla! icon for their site. Unless your site is about Joomla, you should not be using the default favicon. A good habit to get into when developing sites with Joomla! is to change the favaicon and use something more fitting for your site, like your logo. This article will explain how to create a favicon and then how to replace the default icon with your icon. Creating your faviconFor the sake of simplicity, this section assumes you are using your logo for your icon. Step 1: Shrink your logoUsing graphics software (like Adobe Fireworks or Adobe Photoshop), shrink your logo so that it will fit into a 16-pixel by 16-pixel square*. Then, save your new image as a 16x16 PNG or GIF file called "favicon.png" or "favicon.gif". * It helps if your logo has relatively square dimensions, like the Joomla! logo. Step 2: Convert the image to "favicon.ico"This step is actually easier than it may seem. There are several options for doing this step, but my favorite is a web-based tool by Dynamic Drive called the "FavIcon Generator". You simply click the "Browse" button to locate your favicon.png or favicon.gif file, then click the "Create Icon" button to convert your image. The generator will then provide you with a favicon.ico version of your logo. It really is that simple. Step 3: Replace the default icon with your ownThe default favicon is located in the "images" directory of your Joomla! installation. For example, on this site the favicon is located at http://www.howtojoomla.net/images/favicon.ico. Remove the default icon from your site, and upload your new icon in its place. Done.You may not be able to see your new favicon right away. The reason for this is because the default icon is probably still in your browser's cache. If you clear your browser's cache, you will be able to see the new favicon. The favicon is a small thing that really will not affect the performance and look of your site, but paying attention to little details like that will give your site a more finished, professional feel. As always, please feel free to post any questions or comments.
Set as favorite
Bookmark
Email This
Hits: 35099 Trackback(0)
Comments (60)
![]()
Stephan Hodges: ... http://www.panlogicsoftware.com/wordpress/
How would I go about setting up different icons for different pages? Especially forum pages, etc.
1 report abuse
vote down
vote up
May 10, 2007
Votes: -1
mkhor: ...
Good tip! But i see this site is using joomla's default icon.
3 report abuse
vote down
vote up
May 11, 2007
Votes: -1
Rgator: ... http://www.whyijoomla.com/
Now how do you add an animated favicon? These are really cool, though they only work with FireFox for the most part at the moment. Check out http://rgator.com with FireFox to see what I mean.
R 5 report abuse
vote down
vote up
May 12, 2007
Votes: +0
Rgator: ... http://www.whyijoomla.com/
You know, your instructions must only be for 1.0 because this is not working with the 1.5 Beta 2. There is no favicon in the “root” image folder. I have found three different files throughout all the installation and I have replace each with one of my favicons and no luck yet.
Any ideas? R 6 report abuse
vote down
vote up
May 12, 2007
Votes: +1
Rgator: ... http://www.whyijoomla.com/
Finally got it, but I am not sure which switch did the trick!
Cool! NOW TO MAKE AN ANIMATED FAVICON WORK! R ![]() 7 report abuse
vote down
vote up
May 12, 2007
Votes: +0
Ahmad Alfy: ... http://www.alfystudio.com
You can also use this code :
" rel="shortcut icon" /> on your head code and insert your favico.ico on the template folder in case you wanted the icon to change with the template This way we have different icons on different templates ![]() 8 report abuse
vote down
vote up
May 14, 2007
Votes: +1
Ahmad Alfy: ... http://www.alfystudio.com
opps! here is the code :
" rel="shortcut icon" /> 9 report abuse
vote down
vote up
May 14, 2007
Votes: +0
Ahmad Alfy: ... http://www.alfystudio.com
sorry the comment system keep blocking the code
![]() 10 report abuse
vote down
vote up
May 14, 2007
Votes: +0
nivaskapil: ...
hi yaar,
can you help me with how to create a structure like the one in http://www.compassdesigns.net/joomlabook/ check where the login form and about the site and about compass designsmodule resides can you help me out how to use the same kind of effectr in sites. with regards K.Nivas 11 report abuse
vote down
vote up
May 17, 2007
Votes: -1
azman: ...
i was install joomla at localhost. I trying to copy new favicon.ico into /image folder but it seen doesn't change to new icon, it still keep showing joomla icon, but if rename the new favicon to other name instead of favicon.ico, i will work fine. Why?please advice
13 report abuse
vote down
vote up
May 20, 2007
Votes: +0
nivas: ...
hi yaar,
for my website i am in need to arrange a content in such an syntax that i need subcategories within cattegories.is it really possible in joomla. can you help me out with subcategory modules in joomla 14 report abuse
vote down
vote up
June 02, 2007
Votes: +0
Goss: ... http://www.desidiscussion.com
My fav icon appears in the browser address bar but not in the bookmarks. How can I fix this? Thanks!
15 report abuse
vote down
vote up
June 05, 2007
Votes: +0
nicolas: ... http://www.webscriptlab.com
I just found one free favicon generator.
http://www.webscriptlab.com, F...graphics. 17 report abuse
vote down
vote up
June 07, 2007
Votes: +0
DragonTail: ... http://thedeath.org
http://forum.joomla.org/index....714.0;wap2
found this googlin from rrag the guy made that sites favicon 18 report abuse
vote down
vote up
June 23, 2007
Votes: +0
melias: ...
I need help! This has been driving me crazy all day. I am a newbie to anything remotely related to Mambo or web developing or anything so bear with me. I've already created the new favicon I would like to replace but how in the world do I replace it? I know that it is in (mywebsite)/images but how do I get there? If someone could put real simple steps of how to do this I would GREATLY appreciate it!
19 report abuse
vote down
vote up
June 29, 2007
Votes: +0
islatur: ... http://www.islatur.com
thank you for the tip
![]() 21 report abuse
vote down
vote up
August 29, 2007
Votes: +0
Lynn: ... http://www.eatlikeanative.com
I generated the favicon per your instruction and saved to desktop.
I went into the www and public_html folders and deleted the favicon.ico files, uploading the new file to each. I emtied my browser cache, both firefox and safari (using a mac). Still not getting the new favicon. Any ideas? Thanks in advance. Warning. I am a newby. 22 report abuse
vote down
vote up
September 06, 2007
Votes: +0
Lynn: ... http://www.eatlikeanative.com
Got it Cory, thanks. I finally figured it out.
Thanks so much for the great tips. 24 report abuse
vote down
vote up
September 08, 2007
Votes: +0
Linda: ... http://www.soapdom.com
Wow, Cory. I just followed your instructions and bam -- I now have a new favicon on my site. This coming from someone who is not a programmer. Thank you for your website, and sharing your expertise on Joomla. I've been rather lost since the developer who programmed my site basically hightailed it outta town without putting on any of the finishing touches or leaving behind instructions to glean the best out of Joomla. I am so happy I came upon your site.
Thank you again. 25 report abuse
vote down
vote up
September 20, 2007
Votes: +0
webmaster: ... http://www.10-6-club.com
Didn't work in IE7, works ok in Firefox
27 report abuse
vote down
vote up
October 11, 2007
Votes: +0
ian elsby: ... http://www.manchegomoon.com/
Hi Cory,
I need some help please! Ive created a new favicon on my new Joomla site. I followed your instructions to change the default favicon but am getting nowhere fast. 1. I tried to delete the /images favicon.ico but the file does not delete. I tried to upload the new favicon.ico file but Joomla doesnt allow this file to overwrite the existing file in /images folder. 2. I then uploaded a favicon.ico file with a different name into /folders. I then tried to replace the file name in the Global Config field but get this error report...An Error Has Occurred! Unable to open config file to write!...Although the status of the configuration.php file is WRITEABLE. Any help would be appreciated Ian 28 report abuse
vote down
vote up
October 17, 2007
Votes: +0
Adodis: ... http://www.joomla-web-designer.com
Very good information..
Very simple and useful. 30 report abuse
vote down
vote up
October 24, 2007
Votes: +0
Marcus: ... http://joomla.org
thanks 4, easy, simple...brilliant steps
much appreciated Marcus. 31 report abuse
vote down
vote up
October 30, 2007
Votes: +0
steven: ... http://www.clic.com.my
very easy step .... thanks a lot.
32 report abuse
vote down
vote up
November 01, 2007
Votes: +0
IKE: ... http://pinoyguild.com
i've created a new favicon named favicon2.ico
when i reload my website it displays my new favicon for 1-2 seconds then it goes back to default joomla favicon.ico.... can anyone help me with this? thanx in advance 33 report abuse
vote down
vote up
November 13, 2007
Votes: +0
thepcguyonline.com: ... http://thepcguyonline.com
here is what worked for me.
ico wasn't showing but i uploaded my icon and renamed it to something else like pcg.ico i then went into the global config and renamed the default which was set to favicon.ico to pcg.ico. hit save, apply. and bingo it worked. copying or renaming it to favicon did not work for me, but renaming it did. 34 report abuse
vote down
vote up
November 17, 2007
Votes: +0
dwyne nelson: ... http://www.relatos.ws
Thanks a lot for the heads up. that makes a l lot of sense, i will have to get into that.
35 report abuse
vote down
vote up
November 20, 2007
Votes: +0
nelson: ... http://gramatica.biz
thank you very much for the article. great stuff.
36 report abuse
vote down
vote up
November 20, 2007
Votes: +0
john beamer: ... http://f1pitlane.net
In joomla 1.5 rc3 you need to put the favicon in you template file, not in the images file ...
Thanks Cory for the tips 37 report abuse
vote down
vote up
December 01, 2007
Votes: +0
thepcguy: ... http://www.thepcguyonline.com
The pc guy online . com
that animated version didn't work for me but so far so good! ![]() 38 report abuse
vote down
vote up
December 01, 2007
Votes: +0
Jay: ... http://www.hidreview.com
Cory, I want to say THANK YOU for providing a great site and a great service to us all. I saw your little bio and blog page as well. Awesome for you to keep up the family life, great job, and all the sites. Very well done and much appreciated.
39 report abuse
vote down
vote up
December 21, 2007
Votes: +0
Casi: ... http://flumesoft.com/fingerboarding
Hey, just wondering .
lol how do you clear your browsers cache? thanks ![]() 41 report abuse
vote down
vote up
January 29, 2008
Votes: +0
brin: ...
For those of you who can't not view there folders, it might be because you used fantastico. If so then reinstall joomla. Here is a link on the how to.
http://www.compassdesigns.net/tutorials/joomla-tutorials/how-to-install-joomla-1.5.html 43 report abuse
vote down
vote up
February 25, 2008
Votes: +0
Brin: ...
Hey guys another tip for the ones who can't find the Joomla folder in there FTP.......it might be in public_html folder....search for it is there somewhere.
I recommend not using fantastico --- it's a pain. Just upload the files. 44 report abuse
vote down
vote up
February 26, 2008
Votes: +0
jhon: ...
hi ,i tried using your method but none works i am using joomla 1.5.1 i.e the latest one but the favicon dosent gets removed at all
please help 45 report abuse
vote down
vote up
March 03, 2008
Votes: +0
Timmy Taylor: ... http://www.timmytaylor.com
I'm in the middle of Transferring my old-school html site to a new joomla one, and it was taking me forever to find where the favicon goes. I thought it always had to be in the main site folder, not images, but there you go. Ok, now it's time to play with components......
Thanks Cory 46 report abuse
vote down
vote up
March 05, 2008
Votes: +0
Ash Nallawalla: ... http://www.netmagellan.com
No need to clear the cache, as you will delete more than you need to. Just load the new favicon by viewing it in your browser, e.g. in mine it is http://www.trainsem.com/images/favicon.ico. This will replace the version in the cache and you are all set.
47 report abuse
vote down
vote up
March 14, 2008
Votes: +1
Roman: ... http://shinee.org/
Hi,
I have Joomla v.1.5.2, I have looked and looked for this favicon file everywhere! I still can't seem to find it. If anyone can help me please do so. I really need it. -Roman 48 report abuse
vote down
vote up
March 27, 2008
Votes: +0
Adaptiv Media: ... http://www.adaptivmedia.com/
Dynamic Drive has a cool favicon generator. It allows you to make transparent ones too.. How do i clean an old favicon from my cache when i update it to a new one? I just emptied my temporary files but IE7 is still showing up the old one. Any ideas?
50 report abuse
vote down
vote up
March 31, 2008
Votes: +0
ken: ...
for me on joomla 1.5.1 the favicon only works when i put www. in front of my web name when i don't add www. joomla favicon shows up can you help me with this plzz its driving crazy
51 report abuse
vote down
vote up
April 08, 2008
Votes: +0
Casey Carnnia: ... http://www.carnnia.com
Ash Nallawalla hit the nail on the head. The trouble with the favicon that doesn’t want to go away (J 1.5) is in the cached data.
52 report abuse
vote down
vote up
April 08, 2008
Votes: +0
neeraj: ... http://home
I have made favicon icon according to your topic but it is not working properly
give me advise 53 report abuse
vote down
vote up
May 06, 2008
Votes: +0
Andrej: ... http://hop.lt
Good site but could u fix your rss feed
![]() 55 report abuse
vote down
vote up
May 08, 2008
Votes: +0
Mark: ... http://www.pack162ct.org
This is a joomla! 1.0.13 site...
Hmm... My favicon shows when I log in as admin... and it showed in a template I used to use. I just installed a new template, and no favicon... Not even the joomla default fav icon. What in the template could prevent the favicon from showing? Any help/suggestions would be appreciated. My favicon: http://pack162ct.org/cms/images/favicon.ico 56 report abuse
vote down
vote up
May 13, 2008
Votes: +0
Mark: ... http://www.pack162ct.org
Thanks, Cory! You were absolutely right!
I was able to copy/paste the appropriate information and get the favicon to show. 58 report abuse
vote down
vote up
May 13, 2008
Votes: +0
Joel-B: ... http://www.noospheretech.com
With Joomla 1.5, be sure to delete default favicon.ico completely. With most Joomla installs there are permissions issues, so if you can log-in as root or manually delete via cpanel or something before uploading the new icon that is best.
I was having an issue where my new favicon was showing, but then on every re-load it was switching back to the default joomla favicon and then re-loading my new one. After getting around the permissions issue and deleting the old ones, now it works great! 59 report abuse
vote down
vote up
June 03, 2008
Votes: +1
Mike Cross: ...
Finally a set that explains thing very clear. Thanks a lot for explaining the favicon.ico to a T or step by step. ME... I am very new at building web site and for some reason no one I mean no one is telling you what to do step by step and what will be the resoults. Now I have a little question..... how long does it take before I see the favicon change to my logo I uploaded??????
but thanks again it was easy!!!! ![]() 60 report abuse
vote down
vote up
June 25, 2008
Votes: +0 Write comment
|
| < Prev | Next > |
|---|












