Techie Tuesday: How-To Add a Favicon to your Blog

Welcome to the first edition of Techie Tuesday on The How-To Gal. Each Tuesday, I will post a tutorial dealing with something related to blogging, computers or something "techie."

Today, I'm going to show you How-To Add a Favicon to your Blog or Website.

Perhaps your first question is "What the heck is a favicon?" The favicon is the little image that appears next to a website in the address bar and on an opened tab:

Let's get started!

Create your favicon. You'll want to make it a perfectly square image. I used Photoshop, but you can use any image editing program.

Resize your image to 16x16 pixels.

Save your image as a .ico or .png file.

Upload your image to a regular post (you don't need to publish it). Once you upload the image, blogger will assign it a URL. Go into the HTML of your post and extract that URL. You can also upload the image to an external site like ImageShack- they will also give your image a URL.

Step 4
Once your image is uploaded, obtain a URL where the image is hosted.

Visit your Blogger dashboard to add HTML code. To reach the place you can edit your blog's HTML, click on "Layout", then "Edit HTML".

Within the HTML, search for "/head".

Immediately above that line of code, paste two sets of open and close carrots (the following):
< >
In the middle of those sets of carrots paste:

link HREF='Your Image URL here' rel='SHORTCUT ICON'/

link HREF='Your Image URL here' rel='ICON'/


Step 6
Save your template and TEST! Voila, your blog looks that much more professional with a personalized favicon!

If you have any questions or it isn't working for you, let me know.

------------------------------------------------------------------------------------------------------------------

P.S. Are there any other "techie" how-to questions for our Techie Tuesday series that you would like answered?