[SalesForce] Favicon is not working outside of the Community

I am working on a Community for my portal with Napili template. I wanted to have my custom favicon to the entire community.
I have configured Edit Head Markup in the community builder with this: 

<link rel="shortcut icon" href="https:MySalesforceInstance.cs17.visual.force.com/resource/1596737864000/Comm_resources/images/headFavicon.ico" />

But this is working fine, if and only if I logged into our community. Strangely, this config is not working in all the browsers(even with Login) Am I missing anything in the tag?

Please let me know how can I make this favicon icon working on all browsers with or without Logging-in.

Thanks.

Best Answer

For the Favicon to work, I had to upload my image to the orgs assets library: Under Branding>"Select an image to generate a palette" :

enter image description here

enter image description here

Only then was I able to reference my icon, which I had to upload as a 16x16 png image.

Finally, I was able to reference it using the file-asset's relative path as follows:

enter image description here

Notice that the icon name when I reference it has a versioning appended to it, 

<link rel="icon" href="/file-asset/coveofavicon?v=1" type="image/png" />

You can use your browsers dev tools to identify the relative path for your community assets, for reference purposes, here is another link provided that helped resolve this:

<link rel="icon" href="/sfsites/c/file-asset/Favicon_FileName?v=1" type="image/png" />

enter image description here

I did not find this documented anywhere =(, hope this helps other people.

This will change some of your community stylings, since it will detect the colors your image/favicon uses, however, this is easily reversible by re-selecting the original colors you had under the branding option.

Related Topic