Карточка для соцсетей в 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
- /app/