Monday, October 5, 2009

Fav icon for Blog

To add the favorite icon to your blog title bar:

In one of my previous posts I talked about a Wordpress plug-in that allows the non technical people to add a favicon to their Wordpress blogs. Today I will show how to add a favicon to a blogspot blog without using any plug-in. Please keep in mind if you are tech savvy you can add a favicon to your Wordpress blog without and additional plug-in as well.To add a favicon you need to have a favicon and there are plenty of ways to create a favicon.If you are planning on using Photoshop then you need to download this plug-in.

If thats not possible there are plenty of sites out there that generates a favicon for you when you upload an image.Do a Google Search for "free favicon Generator" and plenty of sites would come up.I personally used genfavicon to create favicons because after uploading the image they let you select a portion of the image you want as the favicon. Set the size ( 16 x 16 ) capture and preview and you get a link to download the favicon.ico file. The whole process want take you five minutes.

Since you cant upload .ico files to blogger you need to find some free image hosting service to use and of course that service should let you upload .ico files.Since your using a service by Google I suggest you use Google page creator which lets you upload .ico files.Then get the link to the favicon file.

If thats a bit complicated for you go to http://www.iconj.com/generator.php where it creates a favicon for you and gives the facility to host if for free too.And it generates the url to be added in your header so I think this is the most easiest method for non tech bloggers.Thanks to Military Wife for sharing this info.

Update - I'm getting comments saying that iconj doesn't work anymore. So the best option is to create the favicon using genfavicon and upload it to a free image hosting site. I recommend ImageBoo , you don't have to register and you can upload ico files. After uploading the file select the direct link given at the very bottom. It should look like "imageboo. com/files/1zh7vnfh8qwhu9f1dinu.ico " , add that as the "your url" given in the below instructions.

Now go to your blog and click customize.Then click the Edit HTML tab and search for "title" , this should be inside the header tags.You should find something like mentioned below.



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




Just after that line add the following line and enjoy the nice icon showing up before your url.

<link href="your%20url" rel="shortcut icon" type="image/x-icon"/>

Take your blog to the next level , Learn from ProBlogger Darren Rowse all the secrets you need to make six figures from your blog.ProBlogger: Secrets for Blogging Your Way to a Six-Figure Income

There are some basic mistakes made by blogger , especially new bloggers that can reduce there traffic , networking and money making opportunities. Check whether you have made these blog design mistakes and correct them as soon as possible.

1 comment:

  1. This does not completely remove the old favicon, it only overlaps it. Is there a way to completely remove the blogger favicon.

    ReplyDelete