The favicon is the 16×16 icon you see in the browser tab for a webpage. But this icon can also be used in other locations, like when someone saves your website to the home screen of their phone. The snippet below will load a high resolution version (152×152) on all devices that support it, and fall back to the 16×16 for old versions of IE. For more information, see Understand the Favicon.
This loads favicon-152.png and favicon.ico from your theme’s /images directory. The Genesis theme will auto-load the favicon if it can find it in your theme, so the last line removes Genesis’ favicon code.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| /** | |
| * Add Favicon | |
| * | |
| * @author Bill Erickson | |
| * @link http://www.billerickson.net/code/multiple-sizes-favicon/ | |
| */ | |
| function be_favicon() { | |
| echo '<link rel="icon" href="' . get_stylesheet_directory_uri() . '/images/favicon-152.png">'; | |
| echo '<!--[if IE]><link rel="shortcut icon" href="' . get_stylesheet_directory_uri() . '/images/favicon.ico"><![endif]-->'; | |
| } | |
| add_action( 'wp_head', 'be_favicon' ); | |
| remove_action( 'wp_head', 'genesis_load_favicon' ); |
