Looking to add a favicon to jazz up your tabs?
Bored with your existing favicon and wanna change it?
Whatever your reason, if you want to add a favicon in WordPress (or change favicons) you’re in the right place.
The good news is, adding or changing your favicon is a quick and easy job.
Let’s jump straight in.
What is a favicon?
A favicon is that little icon that sits on the left of a website’s browser tab:
A favicon image can be pretty much anything you want it to be, but people normally use their logo.
Favicons may be small, but they are an important aspect of online branding.
These tiny icons come with a couple of key benefits, including making you easier to find in a sea of tabs (and therefore improving the user’s experience), and making your brand more identifiable.
Sites with no favicon simply display a boring looking sheet of paper, (as you can see in the image further down) which makes your website look unpolished and unprofessional.
So, it’s a good idea to add one to your WordPress site if you haven’t already done so.
Favicons also show up for mobile users so pretty much everyone that visits your site is going to see it.
If you’re anything like me, you probably have at least 10 tabs open at any one time.
The more tabs you have open, the less text you see, so sometimes, the part of the tab displayed is so small that the favicon is all you see:
So, it’s really important to have a recognisable favicon to help strengthen your brand.
How do I add a favicon in WordPress?
First things first, you’re going to need to select or create an image to use as your favicon.
The perfect pixel count for adding favicons in WordPress is 512 x 512.
You also want a square image.
Once you have your image or logo ready, head on over to your main WordPress dashboard and follow these steps:
1. Go to Appearance, then select the option to Customise:
2. From the WordPress customise page, look for the “site identity” option.
Please note that this may not be the exact wording for you.
Depending on the theme and version of WordPress that you’re using, it may be labelled as “Site title, tagline and logo” or “site logo and header”.
3. Once you have found your version of this option, go ahead and click.
Now you’re ready to upload your favicon image.
1. Scroll to find the site icon section. Then click on the grey box that says “Select Image” as shown below:
You should now find yourself in your WordPress media library.
2. First, click on the image you want to use as your favicon, then hit the blue “select” button on the bottom right:
3. At this point, if your image is not square you will be given the option to crop it:
4. Head on back up to the “save and publish” button at the top of the page and that’s it, you’re finished!
Easy, wasn’t it?
How do I change my favicon in WordPress?
Anytime you want to change your favicon, from the main WordPress dashboard just go to Appearance, then select Customise as shown below:
Next, click on “site identity” (just like you did to add your original favicon) and select or upload a new image.
Simple!
How to add a favicon using a plugin.
Some themes require you to use a plugin to change the favicon.
Also, if you use a plugin, you can cover more devices. Not necessary, but nice to have.
If you want to use a plugin, here’s how.
1. Download, install and activate Favicon by RealFaviconGenerator.
2. Go to appearance then Favicon.
3. Hit Select from the Media Library, then click Generate Favicon.
4. You’ll be taken to another site where you can play with the settings to get it looking right on all types of devices.
5. When you’re happy, scroll down and hit the big blue button as shown below:
6. You should be taken back to WordPress where you will see a success message and a preview of how your favicon looks across multiple devices:
That’s it!
I hope that you have found this tutorial useful.
Thanks for reading 🙂
