WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] fav.ico not working in the address bar (20 posts)

  1. abovocipher
    Member
    Posted 4 years ago #

    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?

  2. nv1962
    Member
    Posted 4 years ago #

    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. 16x16, 32x32, 64x64 - don't go overboard with bigger ones; typically the 16x16 size is used in address bars, and there's a dramatic difference in filesize between 'em, too)

    Finally, to be sure: put the favicon.ico file 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.

  3. abovocipher
    Member
    Posted 4 years ago #

    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?

  4. nv1962
    Member
    Posted 4 years ago #

    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.php file to include it. A good place would be right underneath the line containing the HTML <title> tag.

    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.php pointing to where you put that favicon file (the webserver root is usually the best place).

  5. abovocipher
    Member
    Posted 4 years ago #

    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

  6. nv1962
    Member
    Posted 4 years ago #

    Once again: the proper name is NOT fav.ico but 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" />

  7. abovocipher
    Member
    Posted 4 years ago #

    then why would it work here: http://jeffmillies.com and http://jennifertrudo.com ? i have used the same code for both of them.

    i changed the code and it still doesn't show up, here is the link to the site: http://thekevintrudo.com

  8. Pinoy.ca
    Member
    Posted 4 years ago #

    http://thekevintrudo.com/favicon.ico doesn't exist, but http://thekevintrudo.com/fav.ico does.

    Can you hear me now?

  9. abovocipher
    Member
    Posted 4 years ago #

    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?

  10. nv1962
    Member
    Posted 4 years ago #

    Clear your browser cache. Thoroughly.

    Then reload and behold the magically appearing favicon.ico :-)

  11. abovocipher
    Member
    Posted 4 years ago #

    what browser are you using? im using firefox 3.5.2 and its not showing. i manually cleared the cache and refreshed the page.

  12. nv1962
    Member
    Posted 4 years ago #

    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 48x48 - not that it's a crime against humanity, but it's usually best to go with 8x8 or 16x16 (or 32x32 or 64x64 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 16x16 and about 1.1KB - looks pretty good to me!

  13. Pinoy.ca
    Member
    Posted 4 years ago #

    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 16x16 (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 16x16 canvas.

    Me, I renamed and uploaded a 16x16 8-bit-color GIF.

  14. abovocipher
    Member
    Posted 4 years ago #

    Hey pinoy.ca

    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
    http://jeffmillies.com/fav.ico

    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.

  15. 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" />
  16. abovocipher
    Member
    Posted 4 years ago #

    hello songdogtech,

    nice code so that you dont have to add in the whole thing, but it still doesnt work.

    viewing in the latest firefox: http://thekevintrudo.com/

  17. abovocipher
    Member
    Posted 4 years ago #

    Got it working, I found that there was a duplicate line for the favicon that was included in the theme further down the script that I must have missed before.

    Thanks for your patience and suggestions.

    -Jeff

  18. LarryOhio
    Member
    Posted 4 years ago #

    I love the WordPress fora. This thread solved my problem and I didn't even have to ask a question.

  19. abovocipher
    Member
    Posted 4 years ago #

    were you having the same problem as me? im glad it helped :)

  20. flyalaska
    Member
    Posted 3 years ago #

    What file on my wp do I put this code
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">

Topic Closed

This topic has been closed to new replies.

About this Topic