How to add favicon to website?

1137

We, the people who are involved in the web design, Favicon is a well-known word to them. Favicon increases the gracefulness or the beauty of the website. But for the beginners, the word Favicon is unknown to all. If you visit at TheMentalClub.com, then you will watch an icon is called Favicon. The feature of this website is to add Favicon. Let’s start to make the work of the favicon. Another feature of the website is to add Favicon in the website.

favicon

For making the Favicon, select the Favicon on the desktop. Your Favicon may be the JPG mode or may be the JPEG mode. You have to get favicon.ico. For getting your Favicon into .ICO, click on the link http://www.favicon.cc/.

Import your chosen picture which you keep on the desktop for converting to .ICO format.

favicon generator

Upload your picture and generate the Favicon.

After uploading the picture, the work of making Favicon has finished. Now, you download the Favicon. You may also use “Format Factory” software to convert any image format to .ICO format.

The making of Favicon has finished. Now it is a time for adjusting the Favicon in your site.

First, upload the Favicon to “public_html” folder (Recommended). You may upload to the other directories.

Note: If you don’t upload to “public_html” folder, then the Favicon will not show on Google Chrome browser.

For WordPress:

Now, you have to go the theme part in the Admin panel. From here, you have to edit the header.php. Here, paste the code (in below) in before the </head> tag.

<link href=”favicon.ico” rel=”icon” type=”image/x-icon” />

Or

<link rel=”shortcut icon” href=”favicon.ico” />

Or

<link rel=”icon” type=”image/gif” href=”images/favicon.ico” />

Favicon.ico is the name of your favicon. In here, you write the name of your favicon.

The “images” of the above mean that you keep the favicon icon in which folder i.e. if you do not keep the favicon icon in any folder, then you keep the favicon icon in the theme directory. Then, from this code (href=”images/favicon.ico) the images part will skip. Suppose, you will work with “Twentyten“, the default theme of the WordPress. Then, you have to paste the favicon in the twentyten folder. You may make the directory from yourself.

For Blogger (BlogSpot Websites):

Go to the “Template” part >> Click on “Edit HTML” button.

add favicon in blogger

Upload your Favicon to any free hosting, collect the image URL and paste the following code before </head> tag.

<link href=”image URL” rel=”icon” type=”image/x-icon” />

Note: Don’t forget to change the image URL to yours.

Now, save the template and enjoy.

Thank You!