Стандарт Open Graph разработан социальной сетью Facebook. Он позволяет контролировать превью, которое формируется при публикации ссылки на сайт в социальных сетях, и передавать информацию другим интернет-сервисам.
https://yandex.ru/support/webmaster/open-graph/intro-open-graph.html
Например, если страница отображает статью, Open Graph может определить название статьи, автора, изображение и другую важную информацию.
Ниже пример того, как социальная сеть ВК при «шеринге» ссылкой автоматически подтягивает заголовок, картинку и краткое описание при публикации.
Чтобы иметь возможность передавать эти данные нужно включить функцию Данные Open Graph. Переходим в Настройки плагина, раздел Обмен информацией в социальных сетях и включаем:
- Данные Open Graph
- Данные карты Twitter
Теперь после включения функций в исходном коде странице будет специальный блог с тегами этих микроразметок:
Аналогично работает и другая разметка Twitter , которая позволяет отображать предпросмотр с изображениями и текстовым отрывком, когда делятся ссылкой на ваш сайт, но только уже в социальной сети Twitter.
Разметки можно комбинировать. Поэтому, вполне нормально включение обоих стандартов на ваш сайт.
Как пользоваться Open Graph?
Для каждой странице вашего сайта вы можете создавать уникальные превью. Для этого в режиме редактирования страницы найдите раздел плагина Yoast SEO и перейдите во вкладку Социальные сети
Именно здесь вы можете определите, как ваша публикация будет выглядеть в социальных сетях, таких как Facebook, Twitter, Instagram, WhatsApp, Одноклассники, LinkedIn, ВК и других.
Стоит всего лишь заполнить три основных настройки: изображение, заголовок и краткое описание.
Обратите внимание, что для разметки Twitter существует подобный раздел и если стоит задача оформить под социальную сеть Twitter, как то иначе ваше превью ссылки на страницу, то в этом разделе нужно указать отличительные характеристики страницы.
Рассмотрим простой пример. Предположим, мы разрабатываем коммерческий сайт и у нас есть страница Контактов, которую менеджеры в основном отправляют в качестве ссылки партнёрам и клиентам. Вот так по умолчанию выглядит ссылка когда её делятся, например, в WhatsApp
Теперь дополним её осмысленной информацией, например, это может быть брендированная картинка или схема проезда, вместо заголовка Контакты, что то позначимей, а кратком описании, для удобства можно передать номера телефонов.
Заполняем данные…
Теперь если мы поделимся ссылкой на нашу страницу Контактов, то можем увидеть насколько привлекательнее стало её превью:
Согласитесь, больше полезной информации в сравнении с первым случаем — по умолчанию.
Протестировать настройки вашей разметки и посмотреть как это будет выглядеть можно вот тут.
