The Easiest Way To Add Favicons To WordPress Websites
Every WordPress website should have a favicon and luckily adding a Favicon to any WordPress website is incredibly easy. There’s no need to install extra plugins that slow your site down, there’s no need to “look in your header” file for a link rel attribute because that will make the favicon theme dependent, leaving it vulnerable to upgrades.
You don’t need to do anything fancy to add a favicon to your WordPress website. At all!
1. Your Favicon
For starters, you will need a favicon image.
- Create your own favicon image and save it as a png. You can also create your own favicon online here: http://www.favicon.co.uk/index.php
The ideal size for a favicon is 64 x 64 (no matter what anyone says). Also note, the favicon does not need to be an .ico file. Png will work great!
If you do create an .ico favicon, you can do some extra tricks with it.
How To Convert Png Image Files To Ico
There’s a great free website that allows you to convert png files via the internet or your computer to ico.
2. Host/Upload Your Favicon
- Upload your favicon image to the internet, your host manager, and remember the image URL.
A suggestion would be to upload the .ico favicon to the main directory/root folder of your WordPress install (http://example.com/favicon.ico). This allows you to display a favicon to your feed readers. Note, the built in WordPress media library does not upload .ico extensions.
3. Add Theme Function
Now that your favicon image is hosted, add the favicon’s image URL to the code below where it says “ImageURLhere“.
function my_favicon() { ?>
<link rel="shortcut icon" href="ImageURLhere" >
<?php }
add_action('wp_head', 'my_favicon');
- Copy and paste the my_favicon function above to your WordPress theme’s functions.php file.
Sometimes the favicon appears in seconds, in other cases the favicon appears in a few days. Don’t be alarmed at how sporadic it may be.
- Wanna know how to add an Apple Touch Icon?