Инструкции по исправлению предпросмотра ссылок

У вашей ссылки нет изображения, неверный заголовок или старая карточка предпросмотра? Выберите приложение или конструктор сайтов ниже. В каждом руководстве описаны причины, теги, правила для изображений и способы принудительного обновления данных.

Приложения и платформы

Предпросмотр ссылки в LinkedIn не работает или не обновляется

LinkedIn формирует превью из четырех тегов og: и сохраняет кэшированную копию. Исправьте теги, а затем обновите данные страницы с помощью Post Inspector в LinkedIn.

Предпросмотр ссылки в Facebook не отображается или не обновляется

Facebook считывает теги Open Graph с помощью собственного краулера и кэширует результат на срок до 30 дней. Исправьте теги и изображение, а затем повторно выполните проверку URL.

Не работает или не отображается предпросмотр ссылок в WhatsApp

У WhatsApp строгие ограничения: тег <head> должен находиться в первых 300 КБ HTML-кода, а размер изображения не должен превышать 600 КБ. Нарушите хотя бы одно правило — и превью будет маленьким или не отобразится вовсе.

Предварительный просмотр ссылок в iMessage не работает или отображается серым облачком

Приложение «Сообщения» само загружает страницу и не выполняет JavaScript. Без метатега og:image и подходящей иконки будет отображаться лишь простой серый блок с одним заголовком.

Предварительный просмотр ссылок в Slack не работает или не обновляется

Slack генерирует превью ссылок с помощью бота, который считывает теги oEmbed, Open Graph и Twitter Card. Результаты кэшируются в Slack примерно на 30 минут.

Встраиваемое превью в Discord не отображается или не обновляется

Discord запрашивает страницу один раз, считывает теги из HTML-кода сервера и кэширует предпросмотр примерно на 30 минут. Он никогда не выполняет ваш JavaScript.

Карточка X (Twitter) не отображается или не обновляется

X формирует карточку на основе тегов twitter:, а при их отсутствии переходит к тегам og:. Валидатора, обновляющего кэш, больше нет, поэтому решение — использовать корректные теги вместе с новым URL.

Конструкторы сайтов и фреймворки

Не работает Open Graph изображение в Next.js

Большинство ошибок превью в Next.js связаны с Metadata API: отсутствующий metadataBase, объект openGraph, заменяющий родительский, или размер файла изображения, превышающий лимит.

Изображение OG в WordPress не отображается при публикации записи

В WordPress метатеги Open Graph генерируются SEO-плагином или темой оформления. Конфликт двух источников, кэширование страницы или слишком маленькое изображение — самые частые причины проблем.

Не работает изображение для соцсетей в Shopify

Shopify выбирает изображение для предпросмотра ссылок в строго определенном порядке: сначала код темы, затем настройки темы и только потом изображение в разделе «Настройки». Загрузка не в то место — самая распространенная причина.

Не работает изображение Open Graph в Webflow

В Webflow разметка Open Graph настраивается отдельно для каждой страницы, а не глобально. Для шаблонных страниц CMS требуется поле «Изображение», и все изображения в этой коллекции должны быть одного размера.

Превью для соцсетей во Framer не обновляется

Framer позволяет настроить общее превью для соцсетей на весь сайт, переопределить его для отдельных страниц и задать изображения для каждого элемента CMS. Если новое изображение уже опубликовано, но все еще отображается старое, причина в кэше платформы.

Исправьте страницу, затем кэш

Каждое руководство следует одному и тому же порядку. Сначала правильно настройте теги и изображение на своей странице. Только после этого запросите обновление в приложении, иначе оно снова сохранит версию с ошибкой.

Сначала проверьте теги

В большинстве случаев предпросмотр не работает из-за отсутствия тега og:image, относительного URL изображения или тегов, добавленных с помощью JavaScript. Discord и iMessage не выполняют JavaScript, поэтому эти теги должны присутствовать в HTML-коде, который отправляет сервер.

Проверьте изображение

Используйте изображение в формате JPG или PNG размером 1200 x 630 пикселей, весом до 5 МБ и с абсолютным URL-адресом, начинающимся с https://. Это соответствует минимальным требованиям всех приложений в этих руководствах. Для WhatsApp размер также не должен превышать 600 КБ.

Затем очистите кэш

Каждое приложение сохраняет собственную копию предпросмотра. Изменения на странице отобразятся только после того, как приложение загрузит ее снова.

Часто задаваемые вопросы о предпросмотре ссылок

Почему не отображается предпросмотр ссылки?

Приложению либо не удается прочитать ваши теги, либо оно все еще показывает сохраненную ранее копию. Проверьте текущие данные вашей страницы с помощью инструмента проверки метатегов. Если теги верны, приложению необходимо запросить страницу заново.

Какие теги считывает большинство приложений?

Теги og:title, og:description, og:image и og:url поддерживаются в LinkedIn, Facebook, WhatsApp, iMessage, Slack и Discord. X сначала считывает twitter:card, а для остальных данных использует теги og:.

Как заставить приложение снова запросить мою страницу?

У LinkedIn есть Post Inspector, а у Facebook — Sharing Debugger. В большинстве других приложений нет инструментов для принудительного обновления, поэтому вам придется поделиться ссылкой, которую они еще не видели — например, добавить к тому же адресу параметр ?v=2.