problem with favicon on the blazor site

Saeed Pooladzadeh 86 Reputation points
2022-11-24T11:20:58.617+00:00

Hello,

I have made a site in blazor server.
Why is my favicon not displayed on the site, while when I run it in VisualStudio, it is displayed without any problem?

263874-bla.png

thanks

ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
2,604 questions
Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
803 questions
ASP.NET MVC
ASP.NET MVC
A Microsoft web application framework that implements the model-view-controller (MVC) design pattern.
617 questions
{count} votes

3 answers

Sort by: Most helpful
  1. Saeed Pooladzadeh 86 Reputation points
    2022-11-24T12:09:18.103+00:00

    Can you please explain about <link> element?
    You mean what should I do?

    I just replace the new favicon with the blazor default one.

    263924-bla1.png

    No comments

  2. AgaveJoe 17,311 Reputation points
    2022-11-24T12:39:18.957+00:00

    Your responses are not clear.

    The browser looks for favicon.ico in the application root which is the wwwroot folder not wwwroot/site_icons.

    Did you added a link element or changed how the static file handler works?

    Also, you tagged this question as MVC and Web API but your question states this is a Blazor application.

    No comments

  3. Saeed Pooladzadeh 86 Reputation points
    2022-11-24T13:51:46.737+00:00

    As you can see favicon is in the wwwroot folder:

    263898-bla3.png

    On this page:
    https://www.daveabrock.com/2020/11/08/blast-off-blazor-update-head/
    There is a content:

    Now, we can head over the RealFaviconGenerator site to upload our new icon. After adjusting any settings to our liking, it’ll give us a bunch of icons, which we’ll unzip to the root of our wwwroot directory.

    In index.html in the wwwroot directory, add the following inside the <head> tag:

    <link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon.png">  
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">  
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">  
    <link rel="manifest" href="/site.webmanifest">  
    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">  
    <meta name="msapplication-TileColor" content="#da532c">  
    <meta name="theme-color" content="#ffffff">  
    

    Do you mean this?
    If not, can you explain?