Thursday 2 August 2007

Blogger Icon changing

Have you wondered how these little icons appear next to the web addresses, like the one you see above? When you visit the sites or bookmark them, these icons will make these URLs stand out. These are “Favicons” or “Favorite Icons”.

You would first need to have an icon which you would like to use, bearing the extension .ico format. If you search your hard disk, you might find some icons which are generic. I would suggest that you create one to represent your own unique identity. There are quite a number of free icon editor software which you can download from the net.

As for myself, I went to Download.com site, and downloaded a very small program called Imagicon which can transform images into .ico format. I created an image using Photoshop. You can use any image or pictures if you do not wish to create one. Next, run the program. It is rather simple to use. While you can create icons in 2 sizes – 16x16 and 32x32 – I would think a 16x16 icon is preferable since it is readable in most older browsers.

If you do not wish to download any software, you may also try creating an icon online. Just enter the keywords “online icon generator” into your Google search bar, and you should be able to find several programs that you can try.

Once you have created an icon, save it into your hard disk. The next step of attaching the icon is a little tricky. Ideally, all you need to do is to save it in the root directory of your blog site. Nevertheless, there is no way this can be done. For one, if you try to upload an icon image, Blogger will reject it. Two, any file that is uploaded will not go into the Blogger root directory.

The only method to use will be to upload the icon into some web folder, and create a link. A lot of us do not have personal websites. I created one using Google Page Creator. You can also use the free Google Groups to host your file. For more information on how you can upload files on either of these 2 platforms, you may read the article on Using Google Page Creator and Google Groups.

Once you have done that, take note of the URL of your icon. If you are using Google Page Creator, hovering your mouse over the link, you will see that the file is stored under a directory which looks like this http://yourname.googlepages.com/iconname.ico
where “yourname” is your Gmail account name, and “iconname” is the file name. Copy this URL.

Go back to your Blogger dashboard and under the Template tab, go to “Edit HTML”. Near the top you will see a line like this:-
<#title#><#data:blog.pageTitle/#><#/title#>


Copy and insert the following code below the above line:-

<#link rel="shortcut icon" href="URL of your icon file"/#>


p.s. # should be deleted when you put the codes in your HTML CODES.

Remember to type in the “URL of your icon file”.

Save the template. When you refresh your blog site, you should see your nice little Favicon next to the blog address.

From site: http://tips-for-new-bloggers.blogspot.com/2007/02/adding-favicon-icon-to-blogger-url.html

No comments:

My photo
London, United Kingdom
twitter.com/zhengxin

Facebook & Twitter