What is a favicon and why do I need one?

A favicon (pronounced “fave-icon”) is a small icon or image that represents your website. Favicons are most often found in the address bar of your web browser. Why do you need one? Well, it looks pretty, and it is also used in bookmark lists and like an app icon when saved to a mobile home screen.

That being said, can you guess what this post is about?

That’s Right! I’m going to show you how to create a site icon (AKA Favicon) for your WordPress Blog!
Since I love me some Google Apps, we are going to do this using Google Drawings.

So let’s get started

Go to your Google Drive, select NEW, More, and Google Drawing,

Give it a title

So first you need to make sure you have the Right Size Favicon, and WordPress says it should be 512 pixels by 512 pixels. To specify that size, go to File, Page setup, click customize, select pixels and type in the 512.

Next, you want to go to shapes and select your shape. For this example, we will use a circle.

Once you have your shape selected, you need to resize it to fit in the entire square of the canvas. It comes up automatically Blue with a black outline and you want to fix that next.

If you click on the Fill Color option, you can replace that blue with your brand colors, to make the favicon represent you and your website. You can also change the color of the outline or make it transparent.

You can fill your shape with a logo, or even just the initials of your site, for example, I picked an M.

Select A Font, Size, and Color

I Chose 240 to get it to fit the circle.

Once it looks exactly how you want it, you are going to want to download it as a PNG, so you won’t have the background to deal with.

To do this, Go to File, “Download as” and choose PNG, go through the process of saving to your computer.

Now, you need to get it onto your WordPress site, so you need to log in to your account.  Once there, you need to go to appearance, customize, then “Branding”.  Then, click on either add new image or change image. ( I am currently using the Lifestyle theme in WordPress, but this process should be similar in most themes.

That will take you to your Media Library in WordPress. Go to upload new, and drag the file from the download bar (from when you downloaded as a png) into the box and click select.

 

And that’s all there is to it!!!  Remember to click save, of course! Once the site refreshes, you will see your icon!!!

I hope you enjoyed this tutorial, If you have any questions, feel free to leave a comment, or send me an email.  Also, please share your blog URL in the comments so I can see your favicon!!! Would you like a printable step by step guide?

Till next time…..I will be trying to keep my mind uncluttered, and failing joyously!

XOXO