Press "Enter" to skip to content

How do I add a favicon to my WordPress site?

0

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!

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.

Canva.com 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.

How to create a favicon for your WordPress blog

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.

How to select a free template from Canva.com

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.

How to create a logo with Canva.com

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.

Downloading your logo from Canva

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.

How to find customise in your WordPress admin

Once we are in customize we get something like this. Different themes will have different options.

Customiser in WordPress.org

The option we need in the menu is ‘Site Identity’. Click on that and we get this.

Creating a favicon for your WordPress blog

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.

How to find the size of your image

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.

Creating a favicon for your WordPress blog

From here, we click on ‘Change Image’. After we click on that we go to our WordPress media library.

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.

How do I add a favicon to my WordPress site?

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.

How do I add a favicon to my WordPress site?

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.

How do I add a favicon to my WordPress site?

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.

How do I add a favicon to my WordPress site?

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.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.