Как настроить Open Graph разметку: быстрый старт
Грамотно настроенные метатеги Open Graph формируют привлекательное превью ссылки при публикации в соцсетях или отправке страницы в мессенджеры. Чтобы быстро собрать корректные метатеги для сайта, статьи или карточки товара, откройте генератор Open Graph, заполните ключевые поля формы и обязательно добавьте текст в строку og_description. Нажмите кнопку обработки, скопируйте сгенерированный блок кода и вставьте его в секцию head нужной страницы.
Подготовка исходных данных
Перед отправкой формы подготовьте значения заранее в рабочей заметке. Это сбережет время, защитит от случайных опечаток и позволит быстро воспроизвести генерацию для других страниц сайта или элементов интерфейса.
Для базовой настройки разметки используется следующий набор параметров:
- Тип объекта (og:type): website
- Заголовок (og:title): Тестовый заголовок страницы
- Канонический URL (og:url): https://zyntec.ru/
- Ссылка на изображение (og:image): https://zyntec.ru/static/og-image.png
- Название сайта (og:site_name): Zyntec
- Локаль (og:locale): ru_RU
- Описание (og:description): Описание страницы для социальных сетей.
Поле og_description является строго обязательным. Для технической проверки минимальной границы можно ввести даже одиночный символ а. Если же оставить поле описания полностью пустым, инструмент выдаст предупреждение и не сможет сформировать метатеги.
Сохраняйте в рабочем файле проекта не только исходные параметры, но и сам полученный код, чтобы в любой момент сверить разметку на сайте с исходной версией.
Пошаговая инструкция
- Откройте инструмент. Перейдите в онлайн-генератор Open Graph на Zyntec.
- Заполните форму. Внесите данные страницы (тип, заголовок, адрес, картинку, название и локаль) и проверьте наличие текста в поле
og_description. - Запустите генерацию. Отправьте данные формы на обработку.
- Скопируйте и примените результат. Скопируйте готовый фрагмент HTML-кода и проверьте соответствие тегов вашей задаче.
Наглядный пример и проверка результата
Посмотрим, как выглядит настройка разметки на конкретном примере.
Заполните поля формы следующими значениями:
- og:type: website
- og:title: Тестовый заголовок страницы
- og:url: https://zyntec.ru/
- og:image: https://zyntec.ru/static/og-image.png
- og:site_name: Zyntec
- og:locale: ru_RU
- og:description: Описание страницы для социальных сетей.
После отправки формы инструмент моментально сформирует готовый фрагмент разметки без каких-либо ошибок.
Практический совет: сохраните эти тестовые значения рядом со сгенерированным кодом в базе знаний проекта или брендбуке. Такой шаблон поможет контент-менеджерам и владельцам интернет-магазинов оформлять новые страницы по единому стандарту.
Если вы проверяете работу сервиса на коротких текстах, укажите в поле og_description значение а. Инструмент успешно обработает ввод и выдаст корректный тег. При этом помните, что для реального сниппета в поиске или соцсетях лучше использовать емкое и содержательное описание.
Ограничения инструмента
При генерации метатегов важно помнить о нескольких особенностях сервиса:
- Обязательность описания. Поле og_description должно быть обязательно заполнено, без него генерация не начнется.
- Проверка смысловой части. Инструмент отвечает за корректную структуру метатегов, но не проверяет орфографию, стиль или маркетинговую привлекательность текста. Обязательно вычитывайте готовый текст перед публикацией на сайт.
- Повторные запуски. Генератор создает код заново при каждой отправке формы. Чтобы не потерять финальный вариант разметки, копируйте и сохраняйте сам сгенерированный код.
Возможные ошибки и их исправление
Типичная ошибка возникает в том случае, если форма отправлена без заполненного поля og_description.
В этой ситуации итоговый код разметки не создается, а в интерфейсе появляется сообщение: «Ошибка: Поле og:description обязательно».
Решается это просто: введите текст описания страницы в поле og_description, после чего отправьте форму повторно. Сервис сразу сформирует нужные метатеги.