Hi,

 

I am currently creating a website and am having trouble with the favicon.

 

I used faviconit.com to create the files, I then put them in my sites root folders images folder.

 

I have copied and pasted the code into dreamweaver in my header and linked it up with my files, but its not working, wondering if I have gone wrong somewhere?

 

This is what it looks like:

 

<!-- ****** faviconit.com favicons ****** -->
<!-- Basic favicons -->
<link rel="shortcut icon" sizes="16x16 32x32 48x48 64x64" href="/images/sitegraphics/favicon.ico">
<link rel="shortcut icon" type="image/x-icon" href="/images/sitegraphics/favicon.ico">
<!--[if IE]><link rel="shortcut icon" href="/favicon.ico"><![endif]-->
<!-- For Opera Speed Dial: -->
<link rel="icon" type="image/png" sizes="195x195" href="/images/sitegraphics/favicon-195.png">
<!-- For iPad with high-resolution Retina display running iOS ≥ 7: -->
<link rel="apple-touch-icon" sizes="152x152" href="/images/sitegraphics/favicon-152.png">
<!-- For iPad with high-resolution Retina display running iOS ≤ 6: -->
<link rel="apple-touch-icon" sizes="144x144" href="/images/sitegraphics/favicon-144.png">
<!-- For iPhone with high-resolution Retina display running iOS ≥ 7: -->
<link rel="apple-touch-icon" sizes="120x120" href="/images/sitegraphics/favicon-120.png">
<!-- For iPhone with high-resolution Retina display running iOS ≤ 6: -->
<link rel="apple-touch-icon" sizes="114x114" href="/images/sitegraphics/favicon-114.png">
<!-- For Google TV devices: -->
<link rel="icon" type="image/png" sizes="96x96" href="/images/sitegraphics/favicon-96.png">
<!-- For iPad Mini: -->
<link rel="apple-touch-icon" sizes="76x76" href="/images/sitegraphics/favicon-76.png">
<!-- For first- and second-generation iPad: -->
<link rel="apple-touch-icon" sizes="72x72" href="/images/sitegraphics/favicon-72.png">
<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
<link rel="apple-touch-icon" href="images/sitegraphics/favicon-57.png">
<!-- Windows 8 Tiles -->
<meta name="msapplication-TileColor" content="#FFFFFF">
<meta name="msapplication-TileImage" content="/favicon-144.png">
<!-- ****** faviconit.com favicons ****** -->

 

Any help would be gratefully appreciated

Have you tried removing the slash before /images? Usually with anything like this I always play around with the image path, 9/10 that's the issue. It may be worthwhile using an absolute URL for the time being. It could also be a caching thing, browsers always seem to cache favicons heavily.

 

You can help prevent that by adding something like:

 

 

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

Have you tried removing the slash before /images? Usually with anything like this I always play around with the image path, 9/10 that's the issue. It may be worthwhile using an absolute URL for the time being. It could also be a caching thing, browsers always seem to cache favicons heavily.

 

You can help prevent that by adding something like:

Hi

This seems to be working on chrome now, but on IE, just need to figure how why now

 

Thanks!

have you tried putting it directly in the site root? (not in an images folder) then change the link to it?

have you tried putting it directly in the site root? (not in an images folder) then change the link to it?

Hi,

 

Just changed it, its still the same as before :/

change this

 <!--[if IE]><link rel="shortcut icon" href="/favicon.ico"><![endif]-->

to this

 

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

here replace example.com with your domain name

 

also make sure u using .ico file not .png

if u havent created .ico file make one here

and put it in root as dap mentioned

Edited December 10, 201312 yr by sash_oo7