Member Avatar for IsaacMessi10

Code 01:

<head>

    <title> My Web Page </title>

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

</head>

Code 02:

<head>

    <title> My Web Page </title>

    <link rel = "icon" href = "favicon.ico" type = "image/x-icon" />
    <link rel = "shortcut icon" href = "favicon.ico" type = "image/x-icon" />

</head>

I've tried all these in .ico and .png but neither seem to work, at least on Chrome and IE10.

I have a 256 x 256 icon. I've also reduced the size to 16 x 16.

Plus I've tried using the full path to the file.

Edited by pritaeas because: Moved to HTML/CSS.
  • 8 Contributors
  • 25 Replies
  • 268 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by IsaacMessi10
Member Avatar for silverice282

There is something wrong with your website directory:

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

This kinds of tag should be written like that:

<link rel = "icon" href = "/favicon.ico" />
Member Avatar for mmcdonald

@silverrice I don't think that's the case at all... I've never done such a thing and even with the forward slash you're still reading from the same directory?

I usualy use:

<link rel="shortcut icon" href="/favicon.png" type="image/png">
<link rel="shortcut icon" type="image/png" href="http://www.example.com/favicon.png" />

or:

<link rel='shortcut icon' type='image/x-icon' href='/favicon.ico' />
Member Avatar for JorgeM

I've had challenges over the years with this, but this syntax seems to work best a cross all browsers.

 <link rel="shortcut icon"   href="http://example.com/myicon.ico" />
Member Avatar for LastMitch

Could it be that my png / icon contains trasperency?

@IsaacMessi10

I think IE browser doesn't work well .png extension. I would just used .ico extension.

So on photoshop you need a plugin to do that. But other software you can save it as .ico extension.

To link it well I think I agree with everyone on this thread

Edited by LastMitch
Member Avatar for IsaacMessi10

Off topic: Do you know any good and safe sites to upload my favicon to?
HTML file is saved locally.

I've tried Google Drive but that doesn't seem to work, most probabbly because it doesn't end with "favcon.ico".

Member Avatar for LastMitch

Off topic: Do you know any good and safe sites to upload my favicon to?

@IsaacMessi10

What do you mean by that?

You want to upload the favicon to a website to see how it looks?

I don't have any recommendation for that.

Edited by LastMitch
Member Avatar for <M/>

How about something like this to convert your png's into ico's:

http://www.convertico.com

commented: Nice Research! +12
Member Avatar for IsaacMessi10

I don't own a website, I just created an html file locally on my HDD in a folder with all resources necessary. Somehow I can only see images that are uploaded online as a favicon. Therefore I might as well upload my favicon online to a website which offers cloud storage and stores the file name within the URL eg. www.example.net/favicon.png .

Edited by IsaacMessi10
Member Avatar for LastMitch

How about something like this to convert your png's into ico's:

@<Micheal>

You know it really beat the purpose of creating from scratch but it's a nice link and very useful.

@IsaacMessi10

I assume you are talking about what <Micheal> just mention

Member Avatar for IsaacMessi10

actually I'm explaining the whole thing
thanks Michael but I already used that website to convert my png to ico

Member Avatar for <M/>

You know it really beat the purpose of creating from scratch but it's a nice link and very useful.

It is just fun to stand out :D

Member Avatar for mmcdonald

It is just fun to stand out :D

Have I missed something...? O.o haha

Member Avatar for Nmalik1

You have to take helpf from the stackoverflow.com. You will found more information regarding your coding errors.

Member Avatar for <M/>

You have to take helpf from the stackoverflow.com. You will found more information regarding your coding errors.

Why are you redirecting the op to stackoverflow? You do realize he is asking this on the forum and his question is technically answered. Also, stackoverflow competes with daniweb... so please never bring up stackoverflow as if you want the op to ditch this site and go them (their site sucks fyi...).

Member Avatar for IsaacMessi10

Yeah <M/> is right. Apart from that my code is correct as verified on forums such as stackoverflow.

Member Avatar for IsaacMessi10

hey guys for some reason my favicon decided to show up on both web browsers today :)

Member Avatar for <M/>

hey guys for some reason my favicon decided to show up on both web browsers today :)

I don't think it just randomly appeared... but anyways, do you understand why it worked and if you did, did we help answer your question?

Member Avatar for mmcdonald

I'll be damned if we didn't, he got every answer about favicon under the sun haha, and I agree with <M/>... it was most likely cached.

Member Avatar for IsaacMessi10

Dunno maybe it was a cache problem?

Member Avatar for IsaacMessi10

Dunno maybe it was a cache problem?

Member Avatar for stuvart20135

Favicon must having the size as 32x32

Member Avatar for <M/>

@stuvart, or it can 16x16 (i believe)...

Edited by <M/>
Member Avatar for IsaacMessi10

Favicon can have any size
I've tried it in various squarish sizes such as 16x16, 64x64 and 256x256.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.