简体   繁体   中英

How can I set a page specific favicon?

I am looking for a code that will set page specific favicons. I already have a favicon on the whole site but on several pages throughout the site, I want an alternate favicon.

I found the following code somewhere a while ago and used it on a page once before but it doesn't seem to work now...

<script>(function() {
    var link = document.createElement('link');
    link.type = 'image/x-icon';
    link.rel = 'shortcut icon';
    link.href = 'http://www.iconj.com/ico/8/6/86d29buh2e.ico';
    document.getElementsByTagName('head')[0].appendChild(link);
}());
</script>

If anyone can shed some light on what may be wrong with the code or suggest alternate advice that would be much appreciated.

The code you have created seems to work perfectly fine. It sets the favicon of the page to your icon. The reason that it might not work, is sometimes when something is being hosted locally the favicons will not load from remote sources. I know this is the case for me, when I use google chrome on Windows 10. But if I do the same thing with a linux/firefox combo, it works pefectly fine.

So just make a test to make sure that your setup can actually display any favicons at all. Using the code:

<head>
    <link rel="shortcut icon" 
      type="image/x-icon" 
      href="http://www.iconj.com/ico/8/6/86d29buh2e.ico">
</head>

If you are willing to use JavaScript, I suggest to give a try to favicon.js . Although it offers more features than what you need, it should be able to address your issue. On the homepage of the project, look for "Regular image to icon", this is what you want to achieve.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM