How to Change the Favicon in WordPress

In this quick tip, you'll learn how to change the favicon in WordPress. We will begin the tutorial with a brief intro of favicons by answering questions like what they are and why they are important.

Lets get started.

What are Favicons and Why You Should Use Them?

Favicons are those small images that appear in a browser tab next to the title of any webpage.

Not all websites write their names in the title for every single page that they have. The full title along with the website name might not always be visible even if they do append it at the end. This can make it hard to recognize which website are loaded in which tab. Favicons make this task very easy if either the website is very popular or you are its frequent visitor.

You can see in the above image that the first tab has loaded a Wikipedia page while the third tab has loaded CodeCanyon.

Favicons show up in a lot of places like the browser tabs we just discussed as well as on Google search results in mobile. They are also shown in user bookmarks and browser history.

This means that having your own custom and recognizable bookmark instead of something generic can help your visitors quickly identify your website and maybe increase CTR in search results among other benefits.

How to Change the Favicon in WordPress?

The exact menu items that you have to click in order to reach the final screen can be different depending on the theme you have installed. Just look around a bit under Appearance > Customize and you will most probably find the favicon settings.

Changing Favicon in Default WordPress Theme

The WordPress default themes come with built-in functionality to change the favicon of your website. You can do it in a few steps from the admin dashboard area.

Go to Appearance > Customize from the side menu.

This should take you to the following screen where you can click on Site Identity.

You can set a number of things here like the site title, tagline, logo and the favicon. Click on the Select Site Icon button and choose an image from the media library.

This should update the favicon for your website like the image below.

Changing Favicon in Premium WordPress Themes

Some premium themes might override the default customization setup of WordPress. This basically means that you won't be able to take the default path to add your own favicon. Your best bet in this case would be to just check out a few menu items. Here is an example from the Eduma theme.

Go to Appearance > Customize from the side menu. This will show you a bunch of items. Based on their names, General seems most plausible to contain favicon settings so we click on it.

On the next screen, we click on Logo to change the site favicon.

Here you might see some options about site title, tagline and logo. Scroll down a bit to find the settings that change the favicon.

Final Thoughts

I hope this quick post helped you realize the importance of favicons and how you can change the favicon on your own WordPress website.

One last thing I would like to mention is that favicons will usually be scaled down for display on different devices and in different contexts. Therefore, you should consider using designs that are simple and memorable.