Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – How to remove default icon at the top of next.js?

I have tried as of all I know

  1. Deleted cached

  2. Changed the icon to the one I wanted

    Whatever image I am replacing with favicon.ico it is changing to the previous icon and shows the default

    Help!!!

I am expecting to add icon of my own

Tags:

4

Answers


  2. 0

    As i know, u can remove the default favicon.ico, and add a icon.png at /app folder.You can use name favicon or icon, custom file name is not allowed. Next.js will evaluate the file and automatically add the appropriate tags to your app’s element.

    You can see the nextjs document for more details https://nextjs.org/docs/app/api-reference/file-conventions/metadata/app-icons#image-files-ico-jpg-png

    Login or Signup to reply.
  3. 0

    To change the favicon in your next app, you’ll have to replace the default icon with the new favicon you want. This will mean the new icon will have favicon.ico containing your new icon.

    After correctly replacing it, you must empty cache and hard reload for it to take effect as so:

    enter image description here

    The steps to reproduce:

    1. Enter inspect elements
    2. Right-click on the reload button at top left of the screen (you’ll see the three options as seen in the picture)
    3. Click the third option
    Login or Signup to reply.
  4. 0

    This can happen when the file name is the same as before.

    Potential Solutions:

    1. Try a new file name, such as changing favicon.ico to favicontwo.ico
      and update the link: <link rel="icon" href="/favicontwo.ico" />
    2. Try forcing an update to the icon by adding a version: <link rel="icon" href="/favicon.ico?v=2" /> which forces the browser to
      fetch the file again
    3. Check file type, make sure the icon is a .ico type, which all modern browsers can handle. You can also add a type option: <link rel="icon" href="/favicon.ico" type="image/x-icon" />
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search