How to change favicon for documents opened in new tabs

How to have website’s favicon for documents that are opened in a new tab?

At the moment when, say, a .PDF is opened a new tab appears with the document but the standard Umbraco ‘U’ favicon is displayed. I need to be able to show the relevant site favicon instead. I have had a quick look into this but most solutions seem to point to changing the icon in the Baseline project, but this will surely affect the favicon for all websites? My installation has multiple sites where the favicon is served correctly at the page level by ‘Metadata.cshtml’

I have tried to attach a screengrab (showing two tabs, one of my website with the correct favicon and another tab showing the .PDF with the default Umbraco favicon) but am getting an error.

Using 13.7.1 in Umbraco cloud.

You probably have a favicon.ico file in your wwwroot file.

If such a file is present, the browser will use that as the favicon if there is no meta data pointing elsewhere.

Beware, browsers cache this quite aggresively, so you might need to do a hard reload, to make the browser forget the favicon.

We do indeed have a favicon.ico (the default Umbraco one) in the wwwroot of the baseline solution.

I believe that files like .PDFs, are served directly and hence this root favicon will be used.

In terms of pages, Umbraco can read the metadata file and serve the appropriate favicon dynamically:

var favIcon = $"/ui/img/{siteConfig.ThemeConfiguration?.ThemeName}-favicon.ico";

I need to know a way with this Umbraco setup to serve the website based icon instead of the one in the wwwroot.

You can specify it as a HTTP header

But that would require you to add some middleware to add the header. And in that middleware, you would have to somehow determine what site your are on, eg. by looking at the hostname.

It would ultimately end up making requests to your files slower.

I would not do it…

So as it stands, the server gets the request for the file directly, grabs the favicon in the wwwroot and uses that. Umbraco itself isn’t touched by default.

I would need to intercept this call, look at the URL and serve up the appropriate favicon instead?

Exactly :slight_smile:

Normally requests for static content (eg. files) are handled without Umbraco interfering.