Favicon with App Router
Unanswered
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/head
inside theapp
directory, 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?
4 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
and your done.