Adding a Favicon to a WordPress site is quite straight forward. As the WordPress codex explains, one should just add the favicon.ico file to the theme’s folder, and add this line to the header.php file:
|
1 |
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" /> |
easy.
But still, don’t hurry to add it, there’s an alternative. The header solution is not perfect for two reasons:
First, known fact that is even mentioned in the above link, best practice in WP is to use a child theme. With a child theme, an update won’t wipe out all the changes that were made on the WordPress files.
So, if we are using a child theme and adding a favicon, we must copy the header.php to the child theme, just to add this one line.
Second, the favicon will now show only on the site page, and not on the admin (wp-admin / dashboard) and login pages. It’s a shame.
So here’s a short code to add to the child theme’s functions.php, instead of the code suggested to add in the header, that will add the favicon to the site, the admin panel and the login page:
|
1 2 3 4 5 6 7 |
function add_favicon() { $favicon_url = get_stylesheet_directory_uri() . '/favicon.ico'; echo '<link rel="shortcut icon" href="' . $favicon_url . '" />'; } add_action( 'admin_head', 'add_favicon' ); add_action('login_head', 'add_favicon'); add_action('wp_head', 'add_favicon'); |
The functions.php of the child theme doesn’t replace the parent’s functions.php, so there is no need to copy the parent’s file.
Important Note: don’t forget to place the favicon.ico in the child theme’s folder, where the style.css is 🙂