Перейти к содержимому
Toolars
Каталог
Сообщить об ошибке

Соцсети · утилита · Локально

Генератор метатегов Open Graph

Open Graph Meta Generator

Составляйте теги og:title, og:type, og:url, og:description, og:image и og:site_name с безопасным экранированием и предпросмотром карточки шаринга.

Путь задачи / от ввода к результату

Напишите заголовок и описание

Работает локально · Ничего не загружается на сервер

Как работает Генератор метатегов Open Graph, конфиденциальность и похожие инструменты

Путь задачи / от ввода к результату

Как сгенерировать метатеги Open Graph

  1. 01

    Напишите заголовок и описание

    Заполните «Заголовок» (до 120 символов) и «Описание» (до 300). Заголовок обязателен — генерация без него останавливается с именованной ошибкой, — а описание необязательно и при наличии становится og:description. Оба поля перестают принимать ввод на своих пределах.

  2. 02

    Добавьте URL

    Введите «Канонический URL», который должен быть абсолютным адресом HTTP или HTTPS, и необязательный «URL изображения», который тоже должен быть абсолютным, если заполнен. Недействительные адреса отклоняются с именованной ошибкой до какой-либо генерации, так что относительный путь или голый домен никогда не проскальзывают в теги.

  3. 03

    Задайте название сайта и тип

    Добавьте «Название сайта» до 100 символов и выберите «Тип контента»: «Веб-сайт», «Статья» или «Товар». Тип становится значением og:type, а название сайта — og:site_name; оставьте его пустым, и эта строка просто опускается в разметке.

  4. 04

    Сгенерируйте теги

    Нажмите «Сгенерировать метатеги». Разметка собирается локально по одному элементу meta на строку, каждое значение экранируется для атрибута, а готовый вывод должен укладываться в локальный предел 16,000 символов. Кнопка «Пример» заполняет законченный пример статьи и генерирует его одним нажатием.

  5. 05

    Проверьте и скопируйте

    Проверьте типовую карточку ссылки — она показывает название сайта, а при его отсутствии hostname канонического URL, над заголовком и описанием — и прочитайте сгенерированную разметку в панели вывода. Правка любого поля очищает разметку до следующей генерации. Затем используйте «Скопировать метатеги» для буфера обмена или «Скачать HTML», чтобы сохранить теги как toolars-open-graph-meta.html для head вашей страницы.

Факты об инструменте

Обработка
В вашем браузере
Ввод покидает устройство
Никогда
Хранение
Ничего не сохраняется
Цена
Бесплатно

Ваши данные остаются в браузере.

Генератор метатегов Open Graph использует проверенный путь локального выполнения и не создаёт скрытую историю ввода и вывода.

Локальное выполнение

Работает внутри текущей вкладки браузера.

Никакой скрытой обработки

Активные данные инструмента никогда не становятся записями документов Toolars.

Аккаунт не требуется

Используйте основной сценарий без создания профиля. Избранное синхронизируется с аккаунтом после входа.

Мгновенный сброс

Закройте вкладку — и рабочие данные исчезнут.

Что на самом деле делает Генератор метатегов Open Graph

Разработчица вот-вот выпустит посадочную страницу и хочет, чтобы ссылка корректно разворачивалась, когда команда поделится ею в чате. Она пишет заголовок на 70 символов, описание в два предложения и продакшн-URL, ставит тип «Веб-сайт» и генерирует шесть строк тегов. Генератор метатегов Open Graph собирает строки og:title, og:type, og:url, og:description, og:image и og:site_name с безопасным экранированием и показывает рядом с разметкой типовую карточку ссылки, чтобы она могла проверить усечение до вставки фрагмента в head. Черновой текст и ещё не опубликованный URL остаются во вкладке браузера — без проверочных запросов и без загрузок.

Частые вопросы

Какие теги генерируются?
Всегда og:title, og:type и og:url; плюс og:description, og:image и og:site_name, когда эти поля заполнены. Каждая строка — стандартный элемент meta с атрибутом property, готовый к вставке в head страницы, а необязательные строки полностью опускаются, а не выводятся пустыми.
Как экранируется содержимое?
Каждое значение экранируется для атрибута до попадания в разметку: амперсанды, двойные и одинарные кавычки и угловые скобки заменяются их сущностными формами. Это не даёт заголовкам с кавычками или спецсимволами сломать тег, а сначала каждое значение очищается от окружающих пробелов.
Каковы правила валидации и пределы?
«Заголовок» обязателен; «Канонический URL» должен быть абсолютным URL HTTP или HTTPS, как и «URL изображения», если он заполнен. Длины ограничены 120 символами для заголовка, 300 для описания и 100 для названия сайта, а готовая разметка должна укладываться в 16,000 символов.
Что показывает типовая карточка ссылки?
Карточка печатает название сайта над заголовком и описанием, а когда поле «Название сайта» пусто, откатывается к hostname канонического URL. Это типовой предпросмотр того, как значения читаются вместе, нарисованный локально, — не попиксельный рендер какой-либо конкретной платформы, ведь каждая платформа обрезает и усекает по-своему.
Загружается или запрашивается ли что-нибудь?
Нет. Разметка собирается, а карточка предпросматривается целиком внутри этой вкладки браузера; URL изображения записывается в теги, но здесь никогда не запрашивается. Учётная запись не нужна, а «Сбросить» возвращает значения примера по умолчанию.

Продолжить: Макеты для соцсетей

Связанные задачи, а не тупик.

Перейдите в другую сфокусированную рабочую область, не возвращаясь к полному каталогу.

Фильтры Instagram

Instagram Filters

Обрабатывайте фото рецептами «Аврора», «Нуар», «Закат» или «Яркий» с настраиваемой интенсивностью и скачивайте PNG в исходном разрешении.

Редактирование

Генератор постов Instagram

Instagram Post Generator

Собирайте концепт вымышленного поста — заголовок, подпись и лайки концепта — в трёх темах и экспортируйте промаркированный PNG 1200 × 900.

Публикация

Генератор сторис Instagram

Instagram Story Generator

Оформляйте концепт вымышленной сторис — заголовок, призыв к действию и заданное время — и экспортируйте промаркированный PNG 1080 × 1920.

Публикация

Генератор переписки Instagram

Instagram DM Generator

Разыгрывайте вымышленную переписку в директе — входящие и исходящие строки, заданное время — с водяным знаком FICTIONAL CHAT MOCKUP на PNG.

Публикация