[Resolved] fav.ico not working in the address bar
for some reason, something in this theme is interfering with the fav.ico from showing up in the address bar, but if you bookmark it, then it shows up. I also tried the “classic” theme using the fav.ico code in the header and it work just fine. any ideas?
It helps to check that the file name is
favicon.ico(and not ‘fav.ico’ or something else) and that it’s saved in the appropriate .ico format and size (e.g. 16×16, 32×32, 64×64 – don’t go overboard with bigger ones; typically the 16×16 size is used in address bars, and there’s a dramatic difference in filesize between ’em, too)
Finally, to be sure: put the
favicon.icofile both in the webserver root folder (usually named public_html or www) and in the theme folder.
And once you’re done, clear your browser cache thoroughly – especially the favicon.ico files are persistent critters.
thanks for the quick reply, i tried the suggestions that you provided and still nothing. i think it has something to do with the theme, but i have no idea what it would be. I have identical code that i use for one of my other sites and it has no problems.
any other ideas?
Last thing that comes to mind – I skipped it because it seemed kinda obvious – is to check that there’s actually a call to the favicon.ico file in the theme.
E.g. check in the HTML source code (of any page on your website, doesn’t matter which one) whether you see something like this:
<link rel="shortcut icon" href="http://www.example.com/wp-content/themes/yourtheme/favicon.ico" type="image/x-icon" />
If you don’t see something like that, edit the theme’s
header.phpfile to include it. A good place would be right underneath the line containing the HTML
The location of the favicon file doesn’t matter; it can be either in the webserver root folder (i.e. directly in the public_html or www folder) or just as in that example above, where I linked to the theme’s folder, as that’s very often where a favicon file is placed by the theme author (then again, it’d be strange if the theme’s author didn’t also include a proper favicon link in the theme’s header file but hey, could be an oversight).
The ‘Default’ theme doesn’t have a favicon though, so if you use that theme, you’ll have to upload the favicon file, and also include that line in
header.phppointing to where you put that favicon file (the webserver root is usually the best place).
yeah, i had to add that to the header of my theme and it didnt show up, so i added that code to the default theme to just see if it would show up and it did.
the fav icon shows up but only in the list, not the address bar. here is a screenshot of what im talkin about: https://jeffmillies.com/image-hosting/screen1.jpg
Once again: the proper name is NOT
favicon.ico– this is what’s shown now in your HTML source code:
<link rel="SHORTCUT ICON" href="/fav.ico"/>
Change the name and try using this instead:
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
hey pinoy.ca, thanks for pointing that out. i set the name of the ico in the theme folder to favicon.ico but for got the one in the main html folder. i changed it over and still nothing. any other ideas?
Clear your browser cache. Thoroughly.
Then reload and behold the magically appearing
what browser are you using? im using firefox 3.5.2 and its not showing. i manually cleared the cache and refreshed the page.
Try this alternative:
<link rel="shortcut icon" href="http://thekevintrudo.com/wp-content/themes/edit-3col-rdmban-rr/images/favicon.ico" type="image/x-icon" />
It’s possible that, somewhere between the theme and WP itself, something interferes with images placed at root-level.
Please, don’t forget to triple-check that you put the fully qualified URL there (just as in my example) and that, indeed, the file exists: with that name, and in that exact location.
Finally: your favicon.ico is 48×48 – not that it’s a crime against humanity, but it’s usually best to go with 8×8 or 16×16 (or 32×32 or 64×64 if you must, but Vista and Windows 7 aren’t majority cases – yet) and if you use a decent image editor, you should be able to cut it down to below 1KB in size.
Edited to add: for example, the favicon.ico in use here at WordPress.org is 16×16 and about 1.1KB – looks pretty good to me!
In general, browsers who understand the
rel="shortcut icon"tag can also handle GIF, JPG formats for the file and can scale it. Newer browsers can also handle PNG and APNG. (Very) old browsers who don’t understand the tag expect it at the root folder and expect it in the Windows 95-esque .ICO format.
Here’s non-authoritative stuff to read: http://en.wikipedia.org/wiki/Favicon.ico
When your image is complex and is larger than 16×16 (such as a photo) and the browser shrinks your image — you may not like the pixelated result. If you have time to spare, it’s best to design your favicon on a 16×16 canvas.
Me, I renamed and uploaded a 16×16 8-bit-color GIF.
Thanks for the advice, I tried it out by saving as a gif and lowering the size. still nothing. I am led to believe that there is something in the theme that is conflicting with the favicon. I have a working favicons on other sites that I have made and i have not had any problems.
the fav icon for my personal web page is 678px by 678px
and that works fine. Thanks for all the suggestions but I think the theme is interfering some how. I would be welcome to try any suggestions about changing the theme in anyway.
Best to let a WordPress function generate the favicon link to the ico located in the root of your web directory; that way there’s no problem if you change themes:
<link rel="icon" href="<?php bloginfo('siteurl'); ?>/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="<?php bloginfo('siteurl'); ?>/favicon.ico" type="image/x-icon" />
Or, if you want, the active template directory:
<link rel="icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" type="image/x-icon" />
- The topic ‘[Resolved] fav.ico not working in the address bar’ is closed to new replies.