Favicon for Blogger

| Feb 17, 2009

What is Favicon?

from Wikipedia, the free encyclopedia
A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16x16 pixel square icon associated with a particular website or webpage. A web designer can create such an icon and install it into a website (or webpage) by several means, and most graphical web browsers will then make use of it. Browsers that provide favicon support typically display a page's favicon in the browser's Address bar and next to the page's name in a list of bookmarks. Browsers that support a tabbed document interface typically show a page's favicon next to the page's title. The Microsoft Windows Shell also uses favicons to represent "Internet shortcuts" to web pages.


How to Installing Favicon into Blogger or Blogspot
Step 1
Prepare the favicon that we will use, if you want to search for inspiration, please visit these links below:

* Favicon Gallery (by favicon.co.uk)
* 50 remarkable Favicons (by Smashing Magazine)
* The Favicon Gallery
* MPP Favicon Gallery
* Favicon Gallery (by HTML Kit)
* Download Free Favicon Packs (from Clickfore.com)

You only do mouse over the favicon as you like on the website above, right click and save as.

Step 2
Save favicon on your webhosting (eg googlepages)

Step 3
Login to Blogger

Step 4
Go to "Layout - Edit HTML" and find for the code </head>

Step 5
Put codes below, above the code of Step 4
<link href='http://url-address.com/favicon.png' rel='shortcut icon'/>
<link href='http://url-address.com/favicon.png' rel='icon'/>

Step 6
Save Template

Notes:
* Change the url-address with the url-address where you store Favicon file.
* We can use the favicon format .ico, .png or .gif

Powered by