Question

I am using this format for linking to my favicon.

My favicon.ico file is in the same directory as my HTML files, but for some reason it does not appear when I upload it to my web server. I cleared my cache, closed my browser, and re-opened it, but the favicon will still not appear.

If someone could explain why this is I would really appreciate it.

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

Edit: Also I do not know if this would affect it, but there is a default favicon that appears on my web server. I do not know if it is possible to overwrite this.

Edit 2: Not sure if this makes a difference, but this is the basic structure of my head.

<head>
        <meta charset="utf-8">
        <meta name="author" content="">
        <meta name="description" content="Home">

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

        <link href="css/style.css" rel="stylesheet" type="text/css" media="all" />  
    </head>
Was it helpful?

Solution

According to this answer it looks like it should be rel="icon" instead of rel="shortcut icon".

Also, if your favicon.ico is at the root of your server http://example.com/favicon.ico and your page is in a subdirectory http://example.com/blog/, the browser will try searching for favicon.ico inside the current directory http://example.com/blog/favicon.ico, which would result in a 404 error; to avoid that, you should set href="/favicon.ico" so it always points to the root directory, no matter in what subdirectory you are.

OTHER TIPS

They usually cached. force to refresh as well. get it from your directory

Sometimes /favicon.ico helps. Try this though:

<link rel= "shortcut icon" media="all" type="image/x-icon" href="http://URL.tld/favicon.ico" />

<link rel= "icon" media="all" type="image/vnd.microsoft.icon" href="http://URL.tld/favicon.ico" />

This adds IE support.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top