Title: How To Put An Icon On Your Browser URL Address Bar favicon.ico
Description: how to put an icon on your browser url address bar faviconico Babes Wallpapers
Tags: how, to, put, an, icon, on, your, browser, url, address, bar, faviconico
Info: This Post Has Been Viewed 82888 Times SinceSun Sep 03, 2006 8:41 pm Author webmaster With 138 Replies #373

How To Put An Icon On Your Browser URL Address Bar favicon.ico

Have you ever noticed that when you visit some web site, there is an icon small (little) image that shows (appears) at the top of your browser?

If you have, today you are going to learn how to install an icon picture for your web site, so when users visit your website, you can put your logo. Even better when a visitor bookmarks your url, the browser automatically saves in their favorites to identify your site.

post picture

Here is how to do this:

1. If you have windows, open paint. You can find it in:
Start > Programs > Accessories

2. Set the dimensions to 24x24 pixels: in Image > Attributes (Control - E)
post picture

3. Set Width to 24 and Height to 24 and Click Ok.
post picture

4. To help you create and edit your image better, zoom paint to the highest zoom which is 800%.
To do this, go to View > Zoom > Custom and Select 800%
post picture

5. Create your logo or whatever you want your icon to look like:
post picture

6. After you have created your image, save as "favicon.ico"
post picture

7. Now all you have to do is upload the favicon.ico image to your website root directory. The root directory is the main folder where all your files reside at, like your main index page. Some hosting companies will provide a directory called "html" or "public" or "web" "public_html". You MUST upload to your website root directory, otherwise, your browser will look for the favicon.ico image, will not find it and it will not display it on your browser.

put the following HTML code in between your <head> tags with the follwowing code:


     Code:
<link rel="shortcut icon" href="favicon.ico" />


8. Now that you have uploaded to your root directory, you are done.
DEMO: http://www.wallpaperama.com/favicon.ico

NOTE: There might other easy ways to do this, but this is the only way I know of. If you have a better suggestion, please help us by posting it here.

If you have benefit from this small quick and easy to use step-by-step tutorial, we would appreciate if you link to wallpaperama.com Why link to us? The more sites that link to us, the more people like you will be able to find this free and helpful post.



Thanks,

Wallpaperama Team
Comments (138)
View Top Comments
Leave Your Comments...
#1
Ramesh:
8 seconds ago
#182787
Ramesh Sat May 12, 2012 7:36 pm
I know that some of you are having a hard in replacing the internet explorer icon in the url with yours.

Please, do this as internet explorer keeps your old page cash with the icon name that was used previously. So, rename the icon evertime you try refreshing the page with your new icon. And, make sure you change the name in the html file for the icon. Hope that helps! You must see the icon now once you do it.
#2
Pratham:
1 week ago
#182286
Pratham Fri May 04, 2012 6:53 am
thanks alot.. it worked.. :)
#3
Harshana:
2 weeks ago
#181565
Harshana Mon Apr 23, 2012 10:39 pm
Thank you!
#4
Danneleskry:
1 month ago
#180610
Danneleskry Wed Apr 11, 2012 4:19 pm
Hello, thanks yous for nicest won. I see, you so I help you and my fireplace cannot place above. How I do that? My fireplace has no photo above like frame, but no frame, so I would enjoy company to help assist in awe over nice icon over fireplace in den? We all awe in den. Happy day.
#5
Sppond:
1 month ago
#180341
Sppond Sun Apr 08, 2012 9:47 pm
Thanks you help me alot :)
#6
tony:
1 month ago
#179894
tony Tue Apr 03, 2012 9:10 pm
what do u mean: "between your head" ?
#7
Jason:
1 month ago
#179433
Jason Thu Mar 29, 2012 11:58 am
I kepp getting different code from other places, what does shortcut icon mean. Do i type that or do i insert something into it? PLEASE HELP ME!!
#8
tomex:
1 month ago
#179299
tomex Tue Mar 27, 2012 7:45 pm
Paste it inside the <head></head> tags
#9
Bhavana:
1 month ago
#179297
Bhavana Tue Mar 27, 2012 6:19 pm
I tried, but it doesn't work. I don't understand where should I pest that code. & most imp. thing is that "favicon.ico" this file does not display for editing ....... please help me out ....!!!!
#10
mohit:
1 month ago
#178964
mohit Fri Mar 23, 2012 2:04 am
how do we do this on a wordpress website??
#11
adi:
2 months ago
#177654
adi Sun Mar 04, 2012 3:00 am
thank you it worked great
#12
Apoorv:
2 months ago
#177627
Apoorv Sat Mar 03, 2012 4:37 pm
very good....easy method ...thanks
#13
austa:
2 months ago
#177626
austa Sat Mar 03, 2012 4:21 pm
thank its great but short line of code...so cool
#14
Avinash:
2 months ago
#177236
Avinash Mon Feb 27, 2012 4:32 pm
thank u so much... this ill help me a lot
#15
cora:
2 months ago
#176204
cora Tue Feb 14, 2012 1:25 am
14-373-1280858711ve8391.jpg



RRRRRRRRUUUU ya doing for the mac, scrictly speaking, i'm writing this in 2012!!!!!!!!!!!
i really mean it just please do it for the mac
xxx thanks
#16
Rishank:
2 months ago
#176143
Rishank Mon Feb 13, 2012 4:27 am
13-373-hostel.jpg
I find it and u did it.Well tute from your side.Thanx
#17
Ctechnology24:
3 months ago
#175294
Ctechnology24 Wed Feb 01, 2012 11:56 pm
Thank you very much, it helped me a lot because I am currently developing a site for our software engineering project God bless
#18
Ram:
3 months ago
#174926
Ram Sat Jan 28, 2012 5:02 am
thank u very much
#19
Mohak``:
3 months ago
#174137
Mohak`` Mon Jan 16, 2012 8:06 pm
thnk u it was very nice !!!!!

for some interesting posts visit
harka
#20
bijay:
3 months ago
#174042
bijay Sun Jan 15, 2012 8:55 pm
plz help me guys.....
Leave Your Comments...
Pages: 1234567
Share
| More