Enter your email address:

Delivered by FeedBurner

feedburner count

Let's Change Your Favicon, It's Simple

Labels: ,

Ever wonder how to change that small icon called favicon that will show up along with the address bar?
It's simple, but you need to have an image (better if it's in 16 x 16px size) or you have to be creative to design your favicon.

But don't worry it's not complicated as your imagination :), just give it a try...

There's a lot of favicon creator for free around the web, you can try to googling it. But the one that i use to create mine is Favicon.cc

The first step is to create your personal icon.
With this favicon creator you can upload your own image, and resize it into 16 x 16 px size. But if you have that feel, just design your own favicon and then you can animate it.
But don't forget to match your favicon color with your blog theme, don't want to screw your own blog right?^^  
After you finished with the design thing, download your favicon and save it.

The second step is upload your saved favicon to an image hosting, use your favourite image hosting site, but if you don't have any you can choose Imageshack.us or Photobucket.com.
It's free, but you need to sign up first before uploading your picture.
Don't forget to copy your direct image link after uploading your image.

The third step is go to your blogger dashboard - layout - edit html, find (ctrl + F) this code --> </head> and then copy-paste this code right before/above that code:

<link href='http://URL_OF_YOUR_FAVICON.gif' rel='shortcut icon'/><link href='http://URL_OF_YOUR_FAVICON.gif' rel='icon'/>

Don't forget to change the "URL_OF_YOUR_FAVICON" with the direct URL of your uploaded favicon.
Preview your work, and save it. Now you will see that icon in your blog is changed into your very own Favicon. ^^

I found a better favicon generator, and i'm using it right now...check it out -> www.html-kit.com

Website Hosting India said...
January 24, 2012 at 5:28 PM  

Great tutorial and i am glad to found this post here.Website Hostings

Post a Comment

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment