Adding a custom favicon is a nice little thing you can do to brand your site. Plus it is really easy to do.
A favicon is the little icon you see, either in the address bar or on your browser’s tab, depending on which browser you use. Our favicon is the dial from our logo.
The default favicon in Genesis is a black circle with a white G in the center. To add a custom favicon to a WordPress Genesis theme, simply go to your theme editor under Appearance -> Editor. Open up your Theme Functions (functions.php) file on the right hand side and add this block of code at the bottom:
//* Add support for a custom favicon
add_filter( 'genesis_pre_load_favicon', 'custom_favicon' );
function custom_favicon( $favicon_url ) {
return 'http://yourWebSite.com/webAddressOfYourFavicon.png';
}
Just make sure you change the url above to match the address of your uploaded favicon and your favicon will show up on all of your webpages. You can upload your favicon like you would any image in WordPress and then find the url to paste in. It should look something like: http://www.yourWebSite.com/wp-content/uploads/2014/09/favicon.png.
We found that 32×32 png file works best, but there is some debate over what size/format is best. Just make sure it is a square and in a web-friendly image format and it should work fine!
There you have it! Now go get rid of that little “G” and put a custom favicon on your WordPress Genesis site.
[…] How to Add a Favicon to a WordPress Genesis Theme […]