A comprehensive database for everything WordPress related.

TOP
WPKlik Logo Newsletter

Sign up and receive a free copy of How to Create an online Store with WooCommerce (full guide)

wordpress-favicon

How to Add a WordPress Favicon to Your Site

You probably noticed that every major site you ever visited had a small site icon in the upper left corner of the browser title bar. That site icon, or a favicon, helps every business to build brand awareness. The visitors of the site easily connect that tiny image with the brand. Everybody knows that Facebook favicon has a white f inside a blue square, right? In this guide, we will teach you how to add a favicon to your WordPress site, whether you’re using the Classic Editor or the Gutenberg one. If you don’t have an idea of what your favicon should look like, we suggest you check out some of the popular favicon generators and find inspiration.

Why Favicons are important

As we previously mentioned, a favicon is important for brands that are trying to build their online presence. After all, your website visitors should be able to recall something about the brand you’re building. Having an interesting and unique favicon helps people remember the brand. Also, if you have a generic favicon or no favicon at all, your site won’t be distinguished and seen as a unique, quality website.

How to add a Favicon to Your WordPress site Step by Step

How to create a Favicon

If you don’t want to use one of the favicon generators from the list above, you can create a favicon yourself.

a

As you can see in the picture above, the dimensions of your favicon should be no less than 512×512 pixels. You can use Gimp to easily scale the picture to the required dimensions. Also, you should use a GIF, or a PNG file, if you want to have alpha transparency. That way, when your favicon appears in the browser tab, it won’t have the square background behind it. If you use a JPG picture format, the square will appear.

Both versions are fine, but the decision on which one looks better for your particular case is up to you.

How to add Favicon in WordPress admin

If you have your favicon ready, you can upload it to your WordPress website. Again, it doesn’t matter if you’re using Classic or Gutenberg editor. Go to your WordPress admin and in the menu on the left-hand side of the screen choose Appearance. From the drop-down menu click on Customize, as shown in the picture below:

a

After that, you will see a new menu, where you should click on the Site Identity, as shown in the picture below:

a

Right after that, choose the previously created favicon with the Select Image button:

a

When you’re finished, just click on the Publish button, and you should be able to see your favicon in the left corner of the title bar.

a

There are other easy ways to add a favicon to admin in case you still don’t know how to add a favicon to your WordPress site.

How to pick the best Favicon for your WordPress website

Now that you know that favicon is an important part of your brand, you also know it’s not the best idea to download a free, generic favicon from some random site. Before you pick a design direction, the first step you should take is to think about your industry. Must you play by the book, or can you be creative and let your imagination loose? Are there any prerequisites that your favicon must fulfill before you can complete the design?

When you answer those questions, you should take a look at your competitors’ favicons. The more favicons you memorize, the better and more unique your favicon should be.

Creating a perfect favicon for your business doesn’t end the creative process. Before you settle on a design, you should check how it looks on different platforms and web browsers. If you don’t have access to all devices and browsers, use a free favicon checker and let it decide instead of you.

We hope this article was helpful. If you liked it, feel free to check out some of these articles as well!

Newsletter

WordPress perfection at your fingertips.

If you enjoyed this article, feel free to subscribe to our newsletter using the form below. You can also follow us on Facebook and Twitter and subscribe to our YouTube channel for WordPress video tutorials.

Leave a Reply