Карточка для соцсетей в NextJS

Давайте опишем, как ссылка на сайт будет выглядеть при вставке в мессенджер или соцсеть. В объекте metadata в корневом макете зададим вложенный объект openGraph с заголовком, описанием, адресом страницы, именем сайта и массивом изображений. NextJS превратит эти поля в теги Open Graph:

export let metadata = {
	openGraph: {
		title: 'My Site',
		description: 'Welcome to my site.',
		url: 'https://example.com',
		siteName: 'My Site',
		images: [
			{
				url: 'https://example.com/og.png',
				width: 1200,
				height: 630,
				alt: 'Site preview',
			},
		],
	},
};

Добавьте в корневой макет данные для предпросмотра с английским заголовком, описанием и одной картинкой с размерами.

/src/
- /app/
  - layout.jsx