How to add a favicon icon to your WordPress site
If you look up at your open browser tab, you will see a small icon to the left of the tab, like in the image below.
This icon is called a favicon, favicon stands for "Favorites Icon" and it is used like a site identifier.
In this post I will show you how to add a favicon icon to your WordPress site.
Step 1. Create your Favicon Icon
First you need to create a Favicon, to do this go to
Logomakr is a free logo maker tool. When you go to the site you will be greeted by a video showing you how to use the tool. Watch the video.
Once you watch the video you will be give some more instructions showing you how to use the tool.
Click next on these.
There are lots of different direction you can go when creating your Favicon, here I am going to create a Favicon using one letter on a square back ground.
First I hover over the shapes option on the left and select square.
This gives me a square like below
Now I change the colour of the square by using the colour wheel in the bottom right.
I now have a white square
Within this square I will put my letter.
Go to options on the left and select text.
You will see the following box. I will insert my letter in this box.
Insert your letter in this box.
Change the colour of your letter by clicking the letter and changing the colour with the colour wheel in the bottom right.
Change the font of your letter by using the options in the top of your browser.
Centre your letter by dragging the letter around in the box until it looks centred.
Adjust the size of your square and letter by dragging the corner of each until you are happy with the sizes , the recommended size for a favicon is 512px X 512px but any square should do.
When you are happy with the size of your favicon, select crop in the bottom right
Crop your image, making sure it is 512px X 512px. Double click when you are happy with the size. (look to the top right for the dimensions)
When your image is cropped, click save in the top right
Your image should then start to download. Once downloaded you will be presented with the following box
Click the option to copy the credits. You should add this credit info somewhere on your site.
That’s it, you have created your logo. Go to your downloads folder and open it to see how it looks.
Now you need to add it to your word press site.
Step 2. Add your Favicon to your WordPress site
First you need to log in to the back end of your WordPress site.
Once logged in, look to the left of your dashboard and click on appearances.
Click on customize
What you see here will be theme dependent, I am using the Beaver Builder theme which gives me the view below. Whatever theme you are using you should see a Settings option here somewhere.
Click Settings
Then click Site Identity
You should see something like the following. Click the Select Image button at the bottom.
You will be given the option to upload your favicon here. Drag and drop the image or browse to it and select it.
Once your image is uploaded you will see the following.
Click the select button in the bottom right.
Crop the image if you need to
When you are happy with the image click Crop Image in the bottom right.
You will be given a preview of how your new favicon will look.
If you are happy click Save & Publish at the top.
That’s it. You’re good to go.
Check out your new favicon in the top of your browser tab.
