Разметка страниц для Twitter (Twitter Cards)

05.04.2018

9303

Разметка Twitter Card добавляется в <head> каждой страницы сайта и используется для расширенного описания ссылки, вставленной в твит.

Правильность разметки можно проверить на cards-dev.twitter.com

URL и изображение должны быть открыты для индексации в robots.txt.
Если ресурсы сайта закрыты, то можно добавить отдельную секцию для Twitterbot:

User-agent: Twitterbot
Allow: /

TEXT

Описание свойств

`twitter:card`	Тип карточки: `summary`, `summary_large_image`, `app`, `player`
`twitter:site`	`@username` – аккаунт сайта
`twitter:creator`	`@username` – аккаунт автора
`twitter:title`	Название
`twitter:description`	Описание
`twitter:image`	Ссылка на изображение
`twitter:url`	Ссылка на страницу

Пример разметки для обычной карточки

<head>
	<meta name="twitter:card" content="summary">
	<meta name="twitter:site" content="Аккаунт сайта в Твиттере">
	<meta name="twitter:creator" content="Аккаунт автора в Твиттере">
	<meta name="twitter:title" content="Название страницы">
	<meta name="twitter:description" content="Описание страницы">
	<meta name="twitter:image" content="http://example.com/image.jpg">
	<meta name="twitter:url" content="http://example.com">
</head>

HTML

Twitter Cards

Вариант с большой картинкой

<head>
	<meta name="twitter:card" content="summary_large_image">
	<meta name="twitter:site" content="Аккаунт сайта в Твиттере">
	<meta name="twitter:creator" content="Аккаунт автора в Твиттере">
	<meta name="twitter:title" content="Название страницы">
	<meta name="twitter:description" content="Описание страницы">
	<meta name="twitter:image" content="http://example.com/image.jpg">
	<meta name="twitter:url" content="http://example.com">
</head>

HTML

Twitter Cards