favicon: unable to replace ionic logo for favicon.ico

[mg1075]

How does one add a custom favicon.ico file?

When I replace the favicon.ico files in these location
(which are transparent and not like the blue favicon displayed in chrome),
nothing changes. The blue ionic favicon is what displays.

www/assets/icon/favicon.ico
src/assets/icon/favicon.ico

I am guessing this has something to do with an ionic-cli build process?

[t1gu1]

I've the same problem.
I changed the image but I always have the ion favicon in the tab of my browser..

[lkitto]

I too am experiencing this. Cannot replace Ionic favicon. Despite replacing favicon.ico file, Ionic favicon always shows up.

[MichaelNeas]

I am able to get the favicon when after I ionic build browser and ionic run browser, but any time I do ionic serve the ionic favicon comes back. Not sure if we can control it within ionic serveinstance currently.

[ifbbprochris]

I have the same problem

[raphaelbadia]

Hey guys. I can't believe it's so hard to customize a favicon. I searched the web and I can't find any working answer. Up.

[imhoffd]

More suitable for stack overflow or the Ionic forum.

[Barryrowe]

@dwieeb I just wanted to point out that this looks pretty bad from a consumer standpoint. This is an issue that people are legitimately encountering, and to see it as being dismissed in this manner is not reassuring.

I understand if this is discussed elsewhere closing the ticket. However, your closing comment (and the only feedback from the ionic team) is essentially "go look/talk about this somewhere else and don't bother us with it"

If there is an existing stackoverflow post, link to it
If there is an existing forum thread, link to it
If there is a known solution, providing it here would be helpful to everyone on the issue and those coming in the future who expect the issues lists to be the place to go.

[imhoffd]

Hey all, I wanted to chime in again and apologize. I was going through issues in bulk and had glanced over this issue, thinking it was trivial/irrelevant to the CLI, but it is not. I was missing some crucial info, as well. After some research, I assume everyone is using Ionic Angular and ionic serve?

On the latest CLI, if you do ionic build and open the index.html file in your browser, your custom favicon will be present. The problem lies in our livereload server with ionic serve/ionic cordova run/emulate. We're doing something that really surprised me. Despite having <link rel="icon" ... > in our starters for people to change, no matter what image is used or file path set, we overwrite it with an Ionic logo of varying colors, which show the "build status": https://github.com/ionic-team/ionic-app-scripts/blob/master/bin/ion-dev.js#L246-L250

No workaround is needed, as this only affects the favicon while developing, not for actual builds. However, I will be fixing this. We should not be overwriting custom favicons, even during ionic serve.

Again, I apologize. I am still learning the behavior of @ionic/app-scripts myself.

[Barryrowe]

@dwieeb thanks for the update. This makes sense. I could tell it was getting replaced with a data image url on serve, but it never clicked why.

Also I believe my previous message was a bit harshly toned, and It should not have been. I was taking out frustrations of being several layers into a yak-shaving. My apologies.

[imhoffd]

@Barryrowe No worries. We're a small team with a really popular framework, not backed by Google/Facebook, etc. I can understand how frustrating it can be not to get responses to issues that are a big deal, or, when there is a response, it seems half-assed. Your response was warranted, my reply was awful.

[eduibrahim]

I think I've found a kind of solution.

If you want to use Ionic Serve and see on web browser, include < link rel="shortcut icon" href="assets/icon/favicon.ico"/ > in index.html.

If you want to use Ionic Build and see on mobile (android in my case), try to change icon.png in resources and then recompile using ionic cordova resources [android].

Hope this help.

[louise-r-blue]

Not a sophisticated fix but I can change the favicon icon by simply renaming the file and link to favcon.ico