Favicon with App Router
Answered
West African Lion posted this in #help-forum
West African LionOP
I'm trying to add a favicon to my website, but following these instructions, I get the following error:
So I follow the link to the migration page, and look at the favicon options. Even after double checking that I'm on the page for App Router, I still get the outdated instructions
https://nextjs.org/docs/app/api-reference/file-conventions/metadata/app-icons#favicon
I get the following code snippet:
Any suggestions on what the best approach here is?
Warning: You're usingnext/headinside theappdirectory, please migrate to the Metadata API. See https://nextjs.org/docs/app/building-your-application/upgrading/app-router-migration#step-3-migrating-nexthead for more details.
So I follow the link to the migration page, and look at the favicon options. Even after double checking that I'm on the page for App Router, I still get the outdated instructions
https://nextjs.org/docs/app/api-reference/file-conventions/metadata/app-icons#favicon
I get the following code snippet:
<link rel="icon" href="/favicon.ico" sizes="any" />Any suggestions on what the best approach here is?
Answered by Jboncz
all you need to do is simply place your icon file with the file convention provided in the valid location
6 Replies
Ignore any and all of the code referenced in that first screenshot. Its old.
all you need to do is simply place your icon file with the file convention provided in the valid location
Answer
and your done.
West African LionOP
@Jboncz Thank you so much! Mark your response as an answer ❤️
Np!