grangerelixx
How to add favicon?
I have a file called favicon.ico. I would like to know what code goes into this file or any sample code would be appreciated. And how to make this file work?
Most Liked
f0rest8
You can also use something like this site to generate the files for your icons, mentioned in a previous post of mine:
That site has instructions for how to apply them in your code once they are generated and you simply place those generated files in your assets/static location like @APB9785 mentioned. Also, you can reference their instructions with the instructions from this post from @idi527:
Hope that helps in terms of how you make your favicons “work”. 
f0rest8
Sorry to hear it’s no longer working for you!
Did you add all of the files from the example from my post (e.g. apple-touch-icon.png manifest.json browserconfig.xml etc.)? If that’s the case then you would need to include them in your plug Plug.Static:
plug Plug.Static,
...
only: ~w(... favicon.ico apple-touch-icon.png android-chrome-192x192.png android-chrome-512x512.png favicon-16x16.png favicon-32x32.png mstile-150x150.png safari-pinned-tab.svg manifest.json browserconfig.xml ..)
The manifest.json in my example is the json file that they generate for you and name site.manifest. Then, you need to include this in your appropriate html file:
Note: the + is for reader context (from the version control diff) and is not to be included in your file. Also, you’d need to include all of the favicon related files that you have in your plug Plug.Static in a similar fashion.
I have multiple root layouts that I use in Metamorphic, so I created a _favicon.html file and add all of my favicon related code in that and simply render that file in my layouts (note: this goes in the <head>):
<%= render "_favicon.html", assigns %>
If there’s no issue with any of those suggestions, then I’d defer to @kokolegorille’s advice. 
grangerelixx
Thank you so much. It worked!!
Popular in Questions
Other popular topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Real-time error tracking, performance insights, and observability for devs.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #advent-of-code
- #elixirconf-us
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #performance
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Real-time error tracking, performance insights, and observability for devs.
Producing high quality Elixir screencasts since 2017.
Enabling companies to succeed by building software people love.
The deployment platform built for Elixir: PaaS ease, VPS control.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"