How to Install a Favicon

Hey! Here's a new tutorial. It may seem a little hard, but it's really easy :)

 Today's tutorial is on how to install a favicon!

Dunno what a favicon is? Here's a definition.

A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16×16, 32×32 or 64×64 pixel square icon associated with a particular website or webpage.

Here's an example of a favicon.

circled in red above

This blog also has one!

Let's get started! First off, we need to make our favicon. The first way of making your favicon is making your own on Photoshop or something. Make it either 16x16, 32x32 (what I recommend), or 64x64. Also, save it as a .jpg, .png, or a .gif.

Another way of making your favicon is going on some free favicon site and downloading a favicon. FreeFavicon.com is a good place :)

Now we'll need to upload your favicon. Not Tinypic, but another website that not only hosts your image but converts it to the favicon format (.ico)

Go to IconJ.com to upload your image. (Click here for a direct link to the uploader)

Now you'll come another page. You'll see a section that looks like this:

And you'll see that there's an HTML code there. Copy that code...

Now, go to your Blogger Dashboard and go to Design > Edit HTML. Hit CTRL+F on your keyboard and search for this:

<title><data:blog.pageTitle/></title>

This will actually be at the top of the page. (You won't need to scroll down!!!)

Paste the code that you copied earlier right below this line. Save and Preview, and you're done!

You'll now have your prettylicious favicon instead of that fugly Blogger logo as a favicon!

Enjoy :)

Until next time...