Как добавить социальные мета-теги на мой сайт?

Я запускаю этот сайт: https://www.graphicdesignforum.com

Когда я делюсь постом в социальных сетях (Facebook, Twitter, LinkedIn), он выглядит пустым из-за отсутствия мета-тегов для социальных сетей, таких как og:image, og:description и, в частности, тегов, связанных с карточками Twitter. Я бы хотел, чтобы мои посты выглядели как на прикреплённом ниже изображении: с картинкой, заголовком и описанием.

Интересует, не упустил ли я какую-то настройку в движке Discourse, которая позволила бы это настроить, или, возможно, существует плагин, который добавляет такую функциональность.

Вы можете проверить, как ваш сайт отображается в Twitter, здесь: https://cards-dev.twitter.com/validator
А подробнее об Open Graph Protocol можно прочитать здесь: https://ogp.me/

И всё же, если мы посмотрим исходный код этой самой темы, Иван, что мы увидим? :eyes:

<meta name="twitter:card" content="summary" />
<meta name="twitter:image" content="https://d11a6trkgmumsb.cloudfront.net/optimized/3X/d/2/d2e36f2af9cebf5ca3144c0c882c5f35efbceeb1_2_526x500.jpeg" />
<meta property="og:image" content="https://d11a6trkgmumsb.cloudfront.net/optimized/3X/d/2/d2e36f2af9cebf5ca3144c0c882c5f35efbceeb1_2_526x500.jpeg" />
<meta name="twitter:url" content="https://meta.discourse.org/t/how-to-add-social-meta-tags-to-my-site/134111" />
<meta property="og:title" content="Как добавить социальные мета-теги на мой сайт?" />
<meta name="twitter:title" content="Как добавить социальные мета-теги на мой сайт?" />
<meta property="og:description" content="Я запускаю этот сайт: https://www.graphicdesignforum.com  Каждый раз, когда я делюсь постом в социальных сетях (Facebook, Twitter, LinkedIn), пост выглядит пустым без мета-тегов для социальных сетей, таких как og:image, og:description и, в частности, карточек Twitter. Связанные мета-теги. Я хочу, чтобы мои посты выглядели как пример на прикрепленном изображении ниже, с изображением, заголовком и описанием.  Я wondering, не упускаю ли я настройку в движке Discourse, где я мог бы это настроить, или есть ли плагин, который я мог бы добавить t..." />
<meta name="twitter:description" content="Я запускаю этот сайт: https://www.graphicdesignforum.com  Каждый раз, когда я делюсь постом в социальных сетях (Facebook, Twitter, LinkedIn), пост выглядит пустым без мета-тегов для социальных сетей, таких как og:image, og:description и, в частности, карточек Twitter. Связанные мета-теги. Я хочу, чтобы мои посты выглядели как пример на прикрепленном изображении ниже, с изображением, заголовком и описанием.  Я wondering, не упускаю ли я настройку в движке Discourse, где я мог бы это настроить, или есть ли плагин, который я мог бы добавить t..." />
<meta property="article:published_time" content="2019-11-22T05:17:14+00:00" />
<meta property="og:ignore_canonical" content="true" />

Эти теги уже присутствуют везде, где это важно. Посмотрите исходный код сами, если не верите мне.

У меня был пользователь, который был недоволен тем, что у бейджей нет более качественной поддержки обмена. Бейдж выглядит точно так же, как главная страница сайта. (Мне не совсем понятно, что обмен бейджами особенно полезен, но я думаю, что они создадут пользовательские бейджи, которые, по их мнению, будут иметь значение за пределами сообщества)

Вот как выглядит мой сайт после проверки валидатором Twitter по ссылке, которую вы указали выше. Все мета-теги на месте, включая Twitter Card. Вот ссылка на конкретный пост, проверенный этим валидатором:

Кажется, я не понимаю, что именно, по вашему мнению, отсутствует.

Спасибо, ребята! Отличные новости.

Я сбросил robots.txt, и теперь Facebook может подтянуть карточку!