Open Graph — набор meta-тегов (og:title, og:description, og:image и др.), по которым Facebook, VK, Telegram, LinkedIn и часть мессенджеров собирают превью ссылки. В WordPress теги либо ставит SEO-плагин, либо вы выводите их сами в <head>. Без нормальных OG шаринг выглядит как случайный title и «кривая» картинка.
Основные теги
og:title— заголовок карточки;og:description— короткий текст под заголовком;og:image— URL картинки превью;og:url— канонический URL страницы;og:type— обычноwebsiteилиarticle.
Для X/Twitter часто добавляют ещё Twitter Cards (twitter:card, twitter:image) — многие SEO-плагины заполняют оба набора.
Ориентиры по размерам
| Параметр | Практика |
|---|---|
| Картинка og:image | лучше одна явная на URL |
| Рекомендуемый размер | около 1200×630 px |
| Минимум | не мельче ~200×200 |
| Заголовок | укладывайтесь примерно в 60-70 символов |
| Описание | до ~150-200 символов, суть в первых строках |
Точные лимиты у площадок отличаются; безопасный путь — осмысленный title, 1-2 предложения description и горизонтальное изображение без мелкого текста.
Настройка через плагин (предпочтительно)
Самый спокойный вариант — SEO-плагин с блоком Social / Open Graph:
- Yoast SEO — вкладка Social у записи, дефолты в SEO → Social;
- Rank Math — Social meta у поста и в настройках;
- All in One SEO — секция Social Networks / Open Graph.
Типичный порядок:
- включите Open Graph в настройках плагина;
- задайте сайт-wide title/description/image по умолчанию;
- у важной записи переопределите title, description и OG-image;
- проверьте, что в теме нет второго набора дублирующих og:* тегов.
Миниатюра записи (Featured Image) часто уходит в og:image, если отдельную OG-картинку не задали. Для лендингов лучше явно выбрать кадр 1200×630.
Описание: Excerpt и поля плагина
Если плагин берёт описание из excerpt — заполняйте «Отрывок» осмысленно, не копипастой первого абзаца на 1000 знаков. Надёжнее править description в meta-боксе SEO/Social: туда пишете короткий текст именно для превью.
Ручной вывод (тема / functions.php)
Без плагина можно повесить хук wp_head. Упрощённый пример (адаптируйте под тему, экранирование и свои поля):
add_action('wp_head', function () {
if (!is_singular()) {
return;
}
$title = wp_get_document_title();
$desc = has_excerpt() ? get_the_excerpt() : '';
$url = get_permalink();
$img = get_the_post_thumbnail_url(null, 'full');
echo '<meta property="og:type" content="article" />' . "\n";
echo '<meta property="og:title" content="' . esc_attr($title) . '" />' . "\n";
echo '<meta property="og:url" content="' . esc_url($url) . '" />' . "\n";
if ($desc) {
echo '<meta property="og:description" content="' . esc_attr(wp_strip_all_tags($desc)) . '" />' . "\n";
}
if ($img) {
echo '<meta property="og:image" content="' . esc_url($img) . '" />' . "\n";
}
});
Не дублируйте теги, если уже активен Yoast/Rank Math: получите два og:title и непредсказуемое превью.
Проверка превью
- Facebook Sharing Debugger — сброс кэша и разбор og:*;
- VK / Telegram — часто кэшируют; после смены картинки нужен рефреш через отладчик площадки или время;
- просмотр исходника страницы: в
<head>должны быть ваши meta property=»og:…».
Частые ошибки
- нет
og:imageили картинка отдаёт 404 / требует авторизацию; - относительный URL картинки вместо абсолютного https://…;
- дубли meta от темы + плагина;
- кэш CDN/плагина отдаёт старый head — сбросьте кэш после правок;
- слишком длинный description: площадка обрежет посередине фразы.
Связь с SEO
OG напрямую не «поднимает позицию в Google», но влияет на CTR из соцсетей и мессенджеров: нормальное превью = больше переходов. Title/description для поиска и для OG могут отличаться: для шаринга пишите живее и короче, для сниппета поиска — по правилам SEO-плагина.
Кратко
Включите Open Graph в Yoast/Rank Math/AIOSEO, задайте дефолты сайта, для ключевых URL пропишите title, description и картинку 1200×630, проверьте debugger-ом и уберите дубли meta. Ручной код в теме — только если плагина нет и вы контролируете один источник тегов.