Different Favicons For Backend And Frontend

Do you have the same problem? We all have a lot tabs open, especially of our own blogs and all tabs look the same, since there is the same favicon for backend and frontend in your tabs. It can be annoying to click around to find the admin tab between all the opened tabs of some posts of your blog. As you can see on this screenshot:


A little hack in your functions.php of your theme can help you with this problem:

/* Different Favicon for Backend */
function favicon4admin() {
 echo '<link rel="Shortcut Icon" type="image/x-icon" href="' . get_bloginfo('wpurl') . '/wp-content/favicon.ico" />';
add_action( 'admin_head', 'favicon4admin' );

In this case we put the admin favicon in our wp-content folder. Done!


It can be a little helpful hack for your daily work. Of course, the text in the tabs are different most of the time, but not always, and a different looking favicon is more visible.

An easy tool to create a favicon is available at dynamicdrive





11 responses to “Different Favicons For Backend And Frontend”

  1. Stephan Avatar

    sooo simple, but soo great 😉
    another easy favicon-generator can be found at http://www.favicon.cc

  2. Alex Avatar

    Thanks Stephan for the link, sometimes even simple things are worth to mention 🙂

  3. Randy Avatar

    I recommend John Kolbert’s “Admin Favicon” plugin for setting this up without modifying any code: [http://www.johnkolbert.com/portfolio/wp-plugins/admin-favicon/]. I use this for every new WordPress web site I build.

  4. John Hoff - WpBlogHost Avatar

    That’s a really nifty little trick. Very cool and stumbled!

  5. […] Different Favicons For Backend And Frontend – Keine dumme Idee. Kann und sollte man auch außerhalb von WordPress zum Einsatz […]

  6. Michael Avatar

    Randy, a plugin is a bit overloaded for that little piece of code 😉

  7. Randy Avatar

    Michael, Yeah, you are probably right. Though for some users I expect adding any code to the functions.php file might be overwhelming.

    The trouble with putting it in the functions.php file is that it is tied to the theme instead of to the WordPress installation: you can’t upgrade your theme without overriding the changes, and you can’t change the theme without duplicating the code. I imagine both options have their place.

  8. David Avatar

    Good idea and useful, thx for it!

  9. […] finde ich die Möglichkeit, für das Blog-Frontend und den Admin-Bereich unterschiedliche Favicons […]

  10. Alex Avatar

    Welcome David 🙂

  11. favicon generator Avatar

    Simple but effective idea 🙂 Especially when used in chrome browser for me