How To Create Favicon For WordPress Site?

How To Create Favicon For WordPress Site?
04/09/2015

Last Updated

A favicon or Favorites Icon is a small graphic that is associated with a page or Web site. In case you have problems creating one here is short tutorial on how to create favicon for WordPress site?

Favicons are small square images usually 16×16 pixels. They are used by web browsers to show a graphical representation of the site being visited at the left side of the browser’s address bar.

You have probably seen many favicons before, even if you don’t know what they are.

Here is interesting fact: It was named favicon because it was first developed for Internet Explorer. IE calls bookmarked sites “favorites” and this icon was displayed in the favorites menu.

I bet you didn’t know that!

Most site favicons are designed as a small-sized versions of their logo or other branding mechanism. Favicons are very little. Some may say they are least important part of a site.

I personally find favicons very important from a branding point-of-view.

 

How-To-Create-Favicon-For-WordPress-Site

 

Main reason for having favicons nowadays is to improve user experience. Favicons are used in all modern browsers at the address bar, in the links bar, in the bookmarking area and in its browsing tabs.

Few browsers also show favicons whenever you create a shortcut link for the corresponding website in your desktop and your mobile device.

It helps visitors identify your website and more frequent visitors will build an instant recognition for that tiny image.

Also most users usually have many tabs open in their browser window. This hides your website’s title as the number of tabs increase.

The favicon helps user identify your website and quickly switch to the tab they want.

 

How To Create Favicon For WordPress Site?

Creating favicon is very easy. Using some image or your website logo. Even the less tech-savvy of us can do it in about 5 minutes or less, using the right tools.

There are numerous websites that allow you to create a favicon simply by uploading a pre-existent image.

YOU MIGHT LIKE  Woocommerce Amazon Affiliate Plugin

So if you want to create a favicon for WordPress, all you need to do is to upload your logo to one of the following sites and download the favicon file.

Here are some of the Favicon generators:

The websites above vary in terms of file size and extension. If you are looking to get the most compatible file possible, I strongly recommend downloading an image sized 16×16 pixels with the “ico” format.

Now it is only left to add favicon to wordpress.

 

How To Add Favicon To WordPress Site?

After finding out how to create favicon for wordpress site, it is time to use it.

Most wordpress themes have option to easily upload favicon using themes control panel. If your theme doesn’t support that, you will need to do some extra steps.

1. First you’ll need to upload the “favicon.ico” file to your server.You can do that using FTP or cPanel File Manager. Upload the “favicon.ico” file to the root folder.

In most times step 1 will be enough as most modern browsers are smart enough to find your favicon file even without any piece of code, but only as long as the favicon image has 16×16 pixels and  it has been named as “favicon.ico” and is saved in the root folder of your website folder.

 

2. But if favicon doesn’t show up, insert the code below in the HEAD area of your “header.php” file:

<link rel="shortcut icon" type="image/x-icon" href="php bloginfo('url') ?>/favicon.ico">
 

If your theme does not have a header.php file, or you can not find it install and activate Insert Headers and Footers plugin. After activating the plugin go to Settings » Insert Headers and Footers and paste the code provided above in the header section and save your settings.

If you don’t want to deal with FTP at all, then you can also use the plugin called All in One Favicon which is easy to use favicon wordpress plugin.

 

3. Without uploading Plugins there is another way to upload favicon.

– Go to your hosting Hosting CPanel —> File Manager

– Search for the default image in the Theme folder. For example: genesis/images/ favicon.ico

– Upload your .ico file to the same folder and remember the name of the default file (here favicon.ico)

– Then delete default file and rename the new image file with the previous file name.

 

UPDATE

Since WordPress 4.3, you can add a favicon from WordPress admin area. Simply go to Appearance » Customize and click on the ‘Site Identity’ tab.

The site identity section in customizer allows you to change the site title, description, and control whether or not you want to display them in the header.

It also allows you to upload your site favicon. Simply upload the image you want to use as favicon.

Recommended size is 512 x 512 px.

If the image you are uploading exceeds recommended size, then WordPress will allow you to crop it. If it matches the recommended size exactly, then you can just save your changes.

 

How To Create Favicon For WordPress Site? It is easy!

As you could see, creating and uploading favicon is very simple. Go, give it a try if you don’t have one or your site is on default icon.

Favicons are one of those little things that we usually don’t pay too much attention.

But they are a very important part of the web, both from a user interface perspective and a branding point-of-view.

Some say that great things come in small sizes. Web designer and/or branding specialist who always take the time to add a favicon to their clients’ sites or his own, demonstrates a great deal of professionalism and attention to detail.

About Article Author

Kasa
Kasa

Hello, my name is Matija but everybody calls me Kasa. I started this site to earn lots of money so that I never have to work again. Just lay down on a beach, drinking cocktails day after day while hot, beautiful chicks fight for my attention.Ok, now seriously. I love making websites, especially in WordPress. Hope reading content on this site you will find helpful tips, tutorials, comparisons, and product reviews for your business.

write a comment

8 Comments

  1. NullLogic
    December 21, 14:04 #1 NullLogic

    Good day !

    Our plugin SimpleFavicon allows to create favicons for all needed platforms, like Windows, iOS, Android and other. Have a look at CodeCanyon.net market – http://codecanyon.net/item/simplefavicon/9655701?ref=Bestplugin

    // NullLogic

    Reply to this comment
  2. Johhny
    March 06, 14:06 #2 Johhny

    Those are great tips. I was looking how to add favicon to my WordPress site and came across this tutorial.

    Added favicon in no time!

    Reply to this comment
    • Kasa
      March 06, 14:08 Kasa Author

      Glad to hear my tutorial guide helped you dd favicon to WordPress website/blog.

      Reply to this comment
  3. lucky
    September 03, 13:09 #3 lucky

    I went to several websites where you can create a favicon but this I was particularly delighted with its ease , you can create your own favicon that suits you , or upload the image as desired by converting the ICO file. Try it, I recommended http://onlinefavicon.com/

    Reply to this comment

Add a Comment

Your data will be safe! Your e-mail address will not be published. Also other data will not be shared with third person.
All fields are required.