Stan Melching

WordPress Favicon voor Backend Admin

20 mei, 2014
en geplaatst in CMS , Websites , WordPress

Elke designer of webdeveloper vergeet weleens een favicon te maken of in te stellen voor zijn klanten. Hier leggen we snel uit hoe een WordPress Favicon instelt voor de Backend Admin Panel en de Frontend website.

Zoals je in de broncode kan zien van Monsu.nl, roepen wij onze favicon aan met:

1
<link rel="shortcut icon" href="http://monsu.nl/wp-content/themes/MonsuInc/images/favicon.ico">

Bij het werken in de admin zien we echter géén favicon. Tot op heden hadden wij hier geen last van, maar het begint ons toch te irriteren.

Favicon toevoegen voor de WordPress Admin panel

Open de functions.php en scroll helemaal naar beneden. Aan het einde voegt u het volgende toe:

1
2
3
4
5
6
function monsu_favicon() {
        echo '<link rel="shortcut icon" href="'.get_bloginfo('stylesheet_directory').'/images/favicon.ico">';
    }
 
    add_action('wp_head', 'monsu_favicon');
    add_action('admin_head', 'monsu_favicon');

Uitleg: Heel simpel, in deze functie roepen we de aan van echte website en het admin gedeelte, en “plakken” vervolgens het stukje code dat wordt ge-echo’d. Zorg wel dat de .ico in de images map van uw template staat.

Verschillende favicons voor de website en admin

Zo is het ook mogelijk om een ander favicon te gebruiken voor het admin gedeelte. In dat geval maken we twee functies aan:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// Site Favicon
 
function site_favicon() {
        echo '<link rel="shortcut icon" href="'.get_bloginfo('stylesheet_directory').'/images_site/favicon.ico">';
    }
 
    add_action('wp_head', 'site_favicon');
 
// Admin Favicon
 
function admin_favicon() {
        echo '<link rel="shortcut icon" href="'.get_bloginfo('stylesheet_directory').'/images_admin/favicon.ico">';
    }
 
    add_action('admin_head', 'admin_favicon');

Uitleg: Om conflicten te voorkomen hebben we twee mappen aangemaakt: images_admin & images_site. Hier zetten we de respectievelijke favicons.

Deel je opmerking