How To Add Favicon In WordPress Site From Admin Panel?
July 25th, 2016 | by Ravi Chahar || 4 Comments |
Do you have a favicon in your WordPress site? Do you know how to add favicon in WordPress? Before coming to these question let me ask if you know about the favicon of your website. What is a favicon? Why is it important for your website?
In this post, I will give the answer for all the questions. I will guide you to set favicon in WordPress. Though there are man ways, but here I am going to tell you the simplest way. You can add the favicon from your WordPress admin area only.
What is a favicon and How To Install a Favicon In WordPress?
Favicon is an icon which is displayed when you open any website. You may have noticed that when you open any website then you would see any icon along with the name of the website in the tab. That icon is the favicon of a website.
If you are running a WordPress blog then you should have the favicon for your website. It’s a sign of the brand. For an online business, you should have a logo which can be added as the favicon for the website.
You are running a WordPress blog then you should have the favicon for your website. It’s a sign of the brand. For an online business, you should have a logo which can be added as the favicon for the website.
Set favicon In WordPress:
Step 1:- First of all you should think about the favicon. The size of the favicon is 16×16. Don’t worry, you don’t have to create that much small size for the favicon. WordPress will take care of it. You just need to create the favicon which should be at least 512px in size. For better results, create your image as a square.
Step 2:- After creating an image for the favicon, you have to login your WordPress dashboard. Upload the image to your WordPress media. After that go to appearance>>customize.
Step 3:- You will see an option “Site Identity“. Click on that option.
Step 4:- The last option would be to choose the “Site icon“. That is what we call the favicon for your website. To set favicon in WordPress, you have to add an image here. Just click on “Select Image” and select the image you have upload a few seconds ago.
WordPress will crop it according to the requirement. As I have mentioned above that the size of the favicon is 16×16 and you have uploaded an image of greater dimension.
Step 5:- Click on the “Save & Publish” option shown at the top. The work hasn’t finished yet.
In some cases even after the uploading of the site icon, people don’t see the favicon of their website. To solve this problem, you have to add a code in the <head> section of your website.
Step 6:- If you are a tech savvy person then you can add the code in the header.php file of the theme otherwise, you may use any plugin using which you can put this code in the head. The code is:-
<link rel=”icon” href=”file location” />
<link rel=”shortcut icon” href=”file location” />
The file location here is the URL of the image you have uploaded on the Media of your website. To know that location you have to go to the Media Library. You would notice that another image has added by the WordPress. It is because WordPress has cropped the original image.
You to click on that image and would see the URL. Copy that URL and replace the “file location” with that URL. Now you would see the favicon with the name of your website in the browser address bar.
Did You try To Set Favicon In WordPress before?
Are you still thinking how to add favicon in WordPress? Well, I have mentioned the simplest method which can be followed by anyone. Build your website as the brand using the favicon. It shows a unique identity of your WordPress site. You may find many other methods to use to set favicon in WordPress. But all of them won’t work.
Just try to add the favicon using this method. If you want to know any other method then I would let you know. you can use many favicon generators to add the favicon in your website. But every website would recommend to add the link. I am sure, you would prefer the simplest way with no risk.
If you found the tutorial helpful, connect with us on Twitter, LinkedIn, and Facebook.
Having a favicon on a website makes it look more neat and professional. I see no reason why a website in 2016 would be missing one.
Back then I do this by using any of those generator tools and then upload via ftp to my site root folder.. This method is new and makes it easier. That’s how I added mine.
Thanks for sharing these.
It would be Very helpful to individuals battling how to do this.
Hey Babs,
There are many favicon generators online, you can create it. The problem is that after uploading in the site root directory, the favicon won’t appear on all the browsers. I have tried it and couldn’t see in the Google Chrome.
This is the simplest method which can give 100% results. And the most important thing is that the newbies won’t face any problem with that.
Thanks for sharing your thoughts.
Have a great day.
~Ravi
Wow Ravi,
For a non-techi like me, this is so easy to do as you explained it so well….you always have a way of doing that. I’ve seen this around and some of my clients have asked me about it. Of course, I have not added it so now I can go back and refer this article to them.
So if you start getting emails from people with corporate or funny names..they will be my peeps. See…this is why I love to work with bloggers. You are an expert when it comes to things like this and I knowing you well can never disappoint a client because I can send them over to you.
So glad you wrote this timely post!
-Donna
Hi Donna,
Adding a favicon isn’t a big deal. You can use the WordPress option or the favicon generators available online. I have tried the way I have shown in this article and it’s working.
I am glad that you found it helpful and honored you hear such good words about me. You know that you have the power to connect with others with a positive attitude.
Thanks a lot for your support.
Have a rocking weekend.
~Ravi