In this tutorial, we want to show you how to add a favicon to your WordPress website or blog. Before we go into the details, though, it may be prudent to devote a passage or two to what a favicon is and why you should utilise one on your WordPress installation.
What is a Favicon?
A favicon (short for ‘favourites icon’), or page icon as they are sometimes known by, is an icon or image that is associated with a particular website (usually the said website’s brand image) that is displayed in a user’s browser window when landing on the site. It is also displayed next to the particular website’s name within a user’s ‘favourites’ list.
Why Should a Favicon Be Used?
Using a favicon is beneficial in multiple ways:
- It helps identify your website or blog
- It contributes to brand recognition
- Helps build trust with your website’s visitors
- Improves user experience.
An excellent example of why a favicon should be used is the following. Imagine a website user has many tabs open on their browser, yours among them. The more tabs that are open means the smaller each tab becomes, hiding your website title in the process. However, your favicon will always be viewable, instantly letting the user know which tab your site resides in so as to easily get back to it if needed.
Adding a Favicon to a WordPress Site
The first step is to create your favicon image. We will not go into this process as this is not within the scope of this particular blog post, but there are many tutorials online that will show you how to accomplish this.
We are going to assume that you have the most current version of WordPress installed for this tutorial. If you don’t, then you really should. Nevertheless, from WordPress version 4.3 and onwards, you are able to add the favicon to your site via the admin area of the dashboard.
All you need to do is go to Appearance -> Customize and then click on the ‘Site Identity’ tab therein. Within this tab you will find, among other things, the option to upload the file you would like to use as the favicon. Simply select the file that you wish to use, and click upload. That’s all there is to it. Open a new tab in your browser and load your website or blog – you will see the new favicon displayed in all its glory.
Older Versions of WordPress
Trying to add a favicon to an older version of WordPress (4.2 and lower) is a little more intricate and involves manipulating/adding code. Because you really should be using the very latest version of WordPress, if for no other reason than safeguarding your site’s security, we will not go into detail about how to do this in this particular tutorial. Again, there are many online guides to help you do this. Nonetheless, if you are not one for ‘getting your hands dirty’ when it comes to coding, there is, as is usually the case, a plugin available to do the heavy lifting for you. The plugin is called All In One Favicon. Go through the usual procedure for adding a plugin to your WordPress installation and, once installed, just follow the prompts to get your favicon added.