Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Different Favicons on the Same Website?

Contributor ,
Mar 10, 2017 Mar 10, 2017

Hi everyone, Is there any way of having a different favicon on different pages on the same website? For example on all the files in a certain subfolder. I have a website which hosts multiple unrelated projects (each in it’s own subfolder) and it would be good if each could have it’s own favicon.

The code below would put a favicon (in the root folder) on every page on the website, but could you put a favicon in a specific subfolder and direct the browser to use that for all the files within that particular subfolder?

<LINK REL="SHORTCUT ICON" HREF="http://www.gwilliams-designs.co.uk/favicon.ico">

The code below puts a favicon from within the same folder on any page which has this code, so I could just put that on every single file in the folder but the problem with that is if I then ever a have a dedicated website and url just for that project in the future, would I have to go and remove it of every single file to make the main code (above) work?

<LINK REL="SHORTCUT ICON" HREF=".\favicon.ico">

I would be grateful for any advice. Thanks for your help,

9.3K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 10, 2017 Mar 10, 2017

You can set it on a per page basis

<link href="myfavicon.ico" rel="icon">

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Mar 10, 2017 Mar 10, 2017

I read the info on the link but I’m afraid it’s all double dutch to me. I’m not up on coding and the terminology that goes with it and practically every sentence lost me. What I do know from trying that code is that it only works on files that are in the same folder as the favicon. When you have files in yet another subfolder, that code does not work. I presume some sort of modification must be made to direct it to the right folder containing the desired .ico

This is the case also for the  <LINK REL="SHORTCUT ICON" HREF=".\favicon.ico"> code which as far as I can tell achieves exactly the same thing! It only works on the files in the same folder and not on files in yet another subfolder.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 10, 2017 Mar 10, 2017
I read the info on the link but I’m afraid it’s all double dutch to me.

As a Dutchman, I am very comfortable with the language.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Mar 10, 2017 Mar 10, 2017
LATEST

Ha! Ha! or should I have said “it's all greek to me?” ironically, the website the icons are for is a portuguese audio exercises website!! - Skeleton_Portuguese 

Anyway, I think I've figured it out now using either of the codes but adding ../ to the files that are in subfolders of the folder. e.g …

<LINK REL="SHORTCUT ICON" HREF=“../favicon.ico">

This seems to be working on my local site but I haven't uploaded the new files with this code to the remote server yet. Thanks again for your help.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 10, 2017 Mar 10, 2017

I think that you should also have a look at How to Add a Favicon to your Site - QA @ W3C

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Mar 10, 2017 Mar 10, 2017

Thanks Ben, I will look at that link shortly, just before I try out your code I just need to ask a few questions …

To use that code does your favicon have to be named “myfavicon.ico” rather than just “favicon.co”?

If a file is in yet another folder within the subfolder, I assume you have to make some sort of modification to the code for those files as they are not in the same folder as the favicon? Is that the case and if so what?

When using that code am I right to assume that the favicon goes in the appropriate subfolder not the root folder?

Anyway. I will read that link now, thanks again.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Mar 10, 2017 Mar 10, 2017

To use that code does your favicon have to be named “myfavicon.ico” rather than just “favicon.co”?

Can be any name like junk.ico

If a file is in yet another folder within the subfolder, I assume you have to make some sort of modification to the code for those files as they are not in the same folder as the favicon? Is that the case and if so what?

Can be in any location, similar to a normal image

When using that code am I right to assume that the favicon goes in the appropriate subfolder not the root folder?

As long as the link points to the correct icon.

Having said that, I think you should experiment with using a PNG rather than ICO. Also, if there is no link in your document, the browser will default to favicon.ico

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines