In this tutorial, I will walk you through how to add favicon in WordPress step by step. Favicon is a tiny image which appears next to your website title in your browser. This small image, 16 pixels by 16 pixels, is shown next to a website’s URL.
- 1 Why should you Add Favicon in WordPress Site?
- 2 How to Add Favicon in WordPress
- 2.1 How to Create a Favicon:
- 2.2 Method 1: Adding Favicon to using HTML code:
- 2.3 Method 2: Adding Favicon to using HTML PHP:
- 2.4 Method 3: uploading the favicon through your theme’s options page:
- 2.5 Method 4: How to Add favicon Using a Plugin in WordPress:
- 2.6 Method 5: upload your logo via the WordPress Customizer:
Why should you Add Favicon in WordPress Site?
You should add Favicon to increase user experience and site’s usability. When users open many tabs in their browser, the site title starts hiding or being small. This is when favicon helps the user to identify your site. To see this have a look on our screenshot below how to add favicon in WordPress.
Benefits of Using the Favicon in WordPress:
There is an array number of advantages of using a favicon in your site. Firstly, I would like to say; Favicon is a vidual identifier if your website. Favicon also helps your regular users to identify your site from many search results.
- A .ico file can hold more than one icon, no need to have multiple files for 16×16 and 48×48 images.
- It’s best always to have a favicon.Ico file, in order to avoid a “404 not found” error.
- You can use compatible .ico over .png or .gif as your favicon
How to Add Favicon in WordPress
There are so many ways to add a favicon on your website but in this article will show the most popular methods. Let’s see how to add a favicon in WordPress.
How to Create a Favicon:
You can use your band logo as favicon to make your company brandable. We suggest icon image is at least 512 pixels in both width and height.
Make sure you have a Favicon for your site. If you do not still have Favicon, you can follow the link to create perfect Favicon for your website.
Method 1: Adding Favicon to using HTML code:
If you are comfortable with using the code, this method would be handy for you. But if you don’t know how to use code then go with our alternative methods (Follow the next methods).
You must upload your favicon to your website’s root directory using FTP. Now you need to put the following code into your theme’s header.php file.
Importat: Remane your favicon like these “favicon.png”, “favicon.ico”, or “favicon.gif”.
<link rel="icon" href="https://letslearnnow.net//favicon.png" type="image/x-icon" /> <link rel="shortcut icon" href="https://letslearnnow.net/favicon.png" type="image/x-icon" />
Method 2: Adding Favicon to using HTML PHP:
- Go to your WordPress Administration Screen.
- Click on Appearance.
- Click on Theme Editor.
- Select the file wgich is called Header or header.php to edit the file.
- Search for the line of code which startswith <link rel=”shortcut icon” and ends with /favicon.ico”/>. Overwrite it, if it exists, or add the following code below the <head> HTML tag.
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />
6. Save the changes.
Now, you have to replace https://letslearnnow.net with your domain or website’s URL. Make sure up you saved or press from your keyboard ctrl+s to save this.
Method 3: uploading the favicon through your theme’s options page:
All most, premium themes come with theme options, where you created an option to upload your Favicon. To try this one you can visit Be Theme
Simple upload your created image. Make sure you clicked to save the changes to store your settings and reload the page. Your favicon should be there. If you can’t see it, make sure to clear your cache and refresh the site again.
Method 4: How to Add favicon Using a Plugin in WordPress:
When your theme does not, you can take help from the plugin. I think this is the simplest way to do this.
You need to install a plugin from your admin dashboard, If you do not know how to Install a Plugin in WordPress, we have another article on it you can see.
Go to add new plugin > search for Favicon by RealFaviconGenerator when you get this one, click install now. Make sure you also activated the plugin to work with.
Under your dashboard Appearance, you will find Favicon.
Method 5: upload your logo via the WordPress Customizer:
All the theme do not have the option when you have this option on your theme go with this one option, and you do not need to follow the others methods. The suggested method for adding a favicon in WordPress. It’s the fastest and easiest method. And it’ll be available providing you have WordPress version 4.3 or later.
When you will click on Appearance you can see a fantastic option where you can edit or update your Favicon
From here click Site Identity. You will be given the chance to upload the file. When you completed the job make sure you also clicked published.
I hope you learned how to add a favicon in WordPress step by step. If this article helps you make sure you subscribe to Lets Learn, Now YouTube channel to get more WordPress videos and trips to manage your WordPress sites. You can also find us on Twitter and Facebook.