Next.js Discord

Discord Forum

metadata

Unanswered
Capelin posted this in #help-forum
Open in Discord
CapelinOP
anyone know why my image isnt displaying as a thumbnail on embeds?

export const metadata: Metadata = {
  title: "Arka Scrims",
  description:
    "High Level Fortnite Practice in a competitive scene. Access exclusive Lobbies, Session Leaderboards, and join skilled players worldwide.",

  icons: {
    icon: [
      { url: "/icon.png", sizes: "512x512", type: "image/png" },
    ],
    apple: "/icon.png",
  },
};

4 Replies

@Capelin anyone know why my image isnt displaying as a thumbnail on embeds? tsx export const metadata: Metadata = { title: "Arka Scrims", description: "High Level Fortnite Practice in a competitive scene. Access exclusive Lobbies, Session Leaderboards, and join skilled players worldwide.", icons: { icon: [ { url: "/icon.png", sizes: "512x512", type: "image/png" }, ], apple: "/icon.png", }, };
B33fb0n3
the icon is only the favicon. Like the small little image. As far as I understand you, you want to have a huge image on your embeds. For that you need the opengraph image (OG). For that create a opengraph-image.jpg file in the root of the app folder.

You can also add OG images for specific routes by creating a opengraph-image.jpg deeper down the folder structure. For example, to create an OG image specific to the /blog route, add a opengraph-image.jpg file inside the blog folder[`](https://nextjs.org/docs/app/getting-started/metadata-and-og-images#static-open-graph-images)
B33fb0n3
@Capelinsolved?
Torymid wasp
opengraph tags is a faster way for me
@Torymid wasp opengraph tags is a faster way for me
B33fb0n3
for some people its the only way. For example when its an external image, then you need them