17

As stackoverflow.com has logo with it's title, how it can be done for any usual site? Which code is needed for this?

Dinesh Patil
  • 615
  • 2
  • 15
  • 37
Paic Ten
  • 1,791
  • 3
  • 14
  • 10
  • Similar question here: http://stackoverflow.com/questions/4888377/how-to-add-a-browser-tab-icon-favicon-for-a-website – J0ANMM May 11 '17 at 09:32

6 Answers6

35

Are you referring to the favicon?

Upload a 16x16px ico to your site, and link it in your head section.

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

There are a multitude of sites that help you convert images into .ico format too. This is just the first one I saw on Google. http://www.favicon.cc/

MetalFrog
  • 9,943
  • 1
  • 22
  • 24
9

Yes you right and I just want to make it understandable for complete beginners.

  1. Create favicon.ico file you want to be shown next to your url in browsers tab. You can do that online. I used http://www.prodraw.net/favicon/generator.php it worked juts fine.
  2. Save generated ico file in your web site root directory /images (yourwebsite/images) under the name favicon.ico.
  3. Copy this tag <link rel="shortcut icon" href="images/favicon.ico" /> and past it without any changes in between <head> opening and </head> closing tag.
  4. Save changes in your html file and reload your browser.
Community
  • 1
  • 1
Darius
  • 91
  • 1
  • 2
  • A comment that might be useful to someone - if you don't call the favicon "favicon.ico" (e.g. you call it instead "my_favicon.ico"), it won't load. It MUST be called "favicon.ico". – ATJ May 23 '21 at 10:58
1

It's called a favicon. They're easy to do.

John Conde
  • 217,595
  • 99
  • 455
  • 496
0

It's called a favicon. It is inserted like this:

<link rel="shortcut icon" href="favicon.ico" />
Dinesh Patil
  • 615
  • 2
  • 15
  • 37
Brian Warshaw
  • 22,657
  • 9
  • 53
  • 72
0

Put this in the <head> section:

<link rel="icon" href="http://www.domain.com/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="http://www.domain.com/favicon.ico" type="image/x-icon" />

Keep the picture file named "favicon.ico". You'll have to look online to get a .ico file generator.

Hope4You
  • 1,927
  • 4
  • 21
  • 45
0

I was also having the same problem, but its actually a favicon.ico file that you can have. Google favicon.ico generator and either download premade favicons or make your own. And then after insert the following code:

inside the head tag.

Chate Billy Chilima
  • 1
  • 1