WordPress: Admin area favicon

Sometimes I notice that the admin area of WordPress isn’t loading the favicon I’ve uploaded to the root of the site, or in other cases I find it useful to have a slightly different favicon for the admin area compared to the front-end of the site – when you’ve got a lot of tabs open in your browser and are working on multiple client sites at the same time, having extra visual indicators on each tab is quite useful!

Fortunately, there’s an easy way around this. Open your theme’s function.php file and add the following code.

Fix your admin favicon

function pa_admin_area_favicon() {
$favicon_url = get_bloginfo('url') . 'http://cdn.alex.leonard.ie/favicon.ico';
echo '<link rel="shortcut icon" href="' . $favicon_url . '" />';
}

add_action('admin_head', 'pa_admin_area_favicon');

Obviously you’ll need to update the $favicon_url variable so that it matches the your site settings, and if you want a different favicon showing up in the admin area, then change the .ico filename.

Favicon still not showing up?

If you’re still having issues with your favicon not appearing or not changing, it might be that your browser has cached the old favicon.

Here’s a simple trick for fixing your favicon if it’s not showing up, or is still showing the old favicon:

Update the favicon url from:

example.tld/favicon.ico

to

example.tld/favicon.ico?v=2

Please note that this above trick isn’t just for WordPress users, but works on any website. The trick is that it makes the browser think that a new favicon location is being loaded, forcing the browser to load the favicon from the server instead of its local cache. And if you change your favicon again, just change the version to 3!

Comments

  • http://www.mediabox.io/ Nir Dremer

    worked like charm. thanks.

    • http://alex.leonard.ie/ Alex Leonard

      Sweet! Glad it was useful :)

  • http://www.joshmcfarland.net/ Josh McFarland

    Might be better to stick the image in with the theme:

    $favicon_url = get_bloginfo(‘stylesheet_directory’) . ‘/images/favicon.ico’;

    • http://alex.leonard.ie/ Alex Leonard

      Hey Josh,

      Definitely that would work as well. I guess I just put the favicon in the domain root out of habit knowing that if I don’t put any link to it the browser should automatically pick it up, but for tidiness and keeping everything in one place I can see the appeal of keeping it in the theme folder.

      :)

      • http://www.joshmcfarland.net/ Josh

        Still a very useful function regardless of the icon location for those of us picky about our favicon being universal across the site. Thanks for it!

  • http://twitter.com/acoelhosantos André C. Santos

    Was looking for something like this. Worked! Thanks

    • http://alex.leonard.ie/ Alex Leonard

      Hey Andre, thanks for dropping by. Glad to hear it worked for you!

  • 3Dhendo

    Hi – this works OK, but what if the icon is already different, you have changed nothing and therefore there is nothing custom in functions? Can’t find where to change this, and viewing the source doesn’t even return “fav” as a result :)

    Thanks!

    • 3Dhendo

      also there is nothing for “fav” in header.php either

      • http://alex.leonard.ie/ Alex Leonard

        Hi 3Dhendo,

        The icon for your admin area was already something else but there’s nothing in admin page source code to link to a favicon.

        If that is the case I would try setting the URL as

        $favicon_url = get_bloginfo(‘url’) . ‘/favicon.ico?v=2′;

        That might force it into changing and loading not from cache.

        Alex

  • wormeyman

    Thanks! I really appreciate this!

    • http://alex.leonard.ie/ Alex Leonard

      Brilliant – glad it came in handy :)

  • http://www.hubtank.com/ HubTank

    Cool why not you update it to ver 2.0 favicon ? like

    favicon.ico?ver=2

    • http://alex.leonard.ie/ Alex Leonard

      I’m not sure I follow, that’s exactly what I suggested?

      “example.tld/favicon.ico?v=2″

      You can call the query string parameter whatever you want of course, the browser just sees that this might be a different file so reloads it not from cache.

      It could be favicon.ico?want=pizza :)

  • http://www.daxserver.com/ Srihari Thalla

    Thanks :)

    • http://alex.leonard.ie/ Alex Leonard

      You’re most welcome :)

  • Justin Byrne

    Simply and effective, thanks!

    • http://alex.leonard.ie/ Alex Leonard

      Excellent – glad it was useful :)

  • Hemang

    Great..Worked perfect!! Thanks

    • http://alex.leonard.ie/ Alex Leonard

      You’re most welcome!

  • Lorin McCann

    Thank you! Nothing like having ONE thing work on the first try…after a very long day of troubleshooting. Whahoo!

    • http://alex.leonard.ie/ Alex Leonard

      Brilliant :) Happy to help!

  • Deepak

    Works like a charm!! Thanks for sharing man :)

    • http://alex.leonard.ie/ Alex Leonard

      Great, thanks for the feedback Deepak :)

  • http://www.madeintrenbania.com/ Andy

    Hey Alex,

    You don’t need to use…

    get_bloginfo(‘url’) .

    …if you’re using the full link to the favicon.

    Otherwise works great, thanks

    Andy

  • Joe Collins

    Thank YOU this made my day

    • http://alex.leonard.ie Alex Leonard

      Awesome, very glad to have helped :)

    • http://alex.leonard.ie/ Alex Leonard

      Brilliant, glad it was useful to you :)