How do I add a favicon to my WordPress site? First, you design your free logo with Canva.com. If you already have a logo, great. Second, go to your WordPress admin and select ‘Customizer’ to change the appearance of your website. Once in the customizer, select ‘site identity,’ and in there you will find the size requirements for your site icon, your favicon. Third, you upload your logo. Fourth, click publish, now you have added a favicon to your WordPress blog.
Let’s start creating and adding that favicon!
- Design your free logo with Canva.com
- Selecting a free template.
- Downloading your logo from Canva.
- Uploading your favicon to WordPress customizer.
- How to check the size of your image.
- Uploading your resized image to your website.
- Publish your favicon.
- Conclusion.
If you don’t have a logo yet. I recommend using Canva.
Design your free logo with Canva.com
First, let’s head over to Canva.com. Here, you can design a logo for your website blog. You have to set up an account to use Canva. Don’t worry, it only takes a minute.
Canva is free to use to design a logo. It is this logo we are going to use for your favicon.
If you prefer, you can design two logos. One for your main logo, and another smaller logo to be your favicon.
Here is Canva’s homepage.
I love Canva. You can do so much here. You can design your logo, Facebook covers, Instagram post images, and so much more.
We want to design a logo. We can type logo in the box or we can look for the ‘Logo’ link under that.
I can see that ‘Logo’ is the second icon. I will click on that.
From here you have the option of using a template from the left. There are many free templates for you to choose from.
There are other options for on the left. You can change elements, add text, change the background, upload your own image, create folders, or use various applications.
If you have never used Canva before I really recommend you play around with the options to get a feel on how to use Canva.
Selecting a free template
To keep this simple, I will select one of the free templates and change the text.
I just click on the template I like and it will appear on the blank canvas on the right.
Like this.
To change the text, click on the element that contains the text, and type new text or delete the element using the delete icon on the top right.
I will change the text.
There are so many good features on here. You can be very creative and design a unique eye catching logo for your website.
How to download your logo from Canva
Once you have finished designing your new logo, it is time to download it to your computer.
To start, click on the white ‘Download’ link in the top-right of the screen. After you click on this link, you get this popup.
To get your logo, click on download.
Now you have your fabulous new logo saved to your computer. Now it is time to upload it to WordPress to be your favicon.
How to upload your favicon to WordPress customiser
To get to your customizer you first need to find ‘Appearance’ in your WordPress admin menu on the left.
Hover your mouse over ‘Appearance’ and select ‘Customise’.
Like this.
Once we are in customize we get something like this. Different themes will have different options.
The option we need in the menu is ‘Site Identity’. Click on that and we get this.
At the bottom on the left you can see where we need to upload our favicon.
The important thing to note here is that the image needs to be 512 by 512 pixels.
How to check the size of your image
If you are not sure of the size of your image. Then, go to where you have saved your image and hover your mouse over it. When you do this a small popup box will appear giving you some details about your image.
Like this.
We can see that this image is a PNG file, it is 500*500 pixels and only 12.6 KB.
Great, now we have an image we can use as our favicon.
If you use an image that is larger than the 512*512 pixels. Then you will need to go to a website like ‘resizeimage.net‘ to resize your image.
At ‘resizeimage.net‘, you upload your image, and then use their resizing feature to get your image to the required size.
Uploading your resized image to your website
Now we have an image ready to be uploaded. Let’s go back to the customizer in WordPress.
Do you remember how to get there?
Find ‘Appearance’ in the menu on the left of your WordPress admin dashboard. From the popup menu select ‘Customise’. Once you are in the customiser, find ‘Site Identity’ and click on that.
That brings us back here.
From here, we click on ‘Change Image’. After we click on that we go to our WordPress media library.
We don’t have our image uploaded to our library yet. So we need to click on the blue ‘Upload Files’ link in the top left.
From here click on the ‘Select Files’ link and select the image from your computer. You can see that you are reminded that the suggested size is 512*512 pixels.
Once you upload your image you will be taken back to your media library.
I would suggest that with every image you upload to your media library you complete some details on the right. At the very least, you should have a title and the alt text section completed.
These details help with your SEO. When Google or Bing come to look at your site they will understand what this image is.
Once you are finished, click on the blue ‘Select’ link in the bottom right.
The next page is the cropping page.
Our image is the right size so we do not have to crop our image.
On the right you have a preview of what your favicon will look like in a browser tab.
To continue, click on ‘Crop Image’ or ‘Skip Cropping’ and you will have a favicon ready for your WordPress blog.
Publish your favicon
There is one last action you must do to make your favicon live.
Check you image at the bottom and then click on the blue ‘Publish’ link at the top. Now your favicon is live!
To check your favicon, go to your website in any browser and you will see it in the browser tab.
Conclusion
Having a favicon for your website is important, it helps you build your brand.
I use Canva for some of my images but getting a professional to design a logo for you is even better.
For bloggers just starting their journey, using free options like Canva helps keep costs down.
The process of uploading images to WordPress has quite a few steps, but once you have done it a few times it gets easier to remember where you have to go and what actions you need to take.
It feels good when you see your logo on your website and in the browser tab. It also looks good to your visitors.
If you haven’t got round to getting a favicon for your WordPress blog yet, I would suggest you do it soon. If you follow my step by step guide above, you will have a live favicon in no time.
When uploading images to your WordPress blog. It is important that you have ‘alt text’ to your images. This helps with your SEO. To find out how to do this, check out my ‘How to add alt text to images in your WordPress blog‘ post.
Comments
Do you have a favicon yet?
How did you get your favicon?
Did you get a professional to design yours?
Have you ever tried Canva.com?
I look forward to reading your comments.
