Генератор мета-тегів

Створюйте мета-теги SEO, Open Graph і Twitter Card для вашої сторінки на основі заголовка, опису, канонічного URL, зображення, назви сайту й типу картки.

Завантаження інструмента…

Генератор мета-тегів — Заповніть заголовок сторінки, опис, канонічний URL, зображення та назву сайту, щоб отримати готовий до вставлення блок мета-тегів SEO, Open Graph і Twitter Card для секції head вашого HTML. Живі попередні перегляди результатів пошуку Google і соціальної картки показують, як сторінка виглядатиме в пошуку та під час поширення. Усе генерується у вашому браузері — нічого про вашу сторінку не завантажується на сервер.

Що таке Генератор мета-тегів?

Генератор мета-тегів — це безкоштовний онлайн-інструмент, який перетворює кілька даних про сторінку на повний набір HTML-мета-тегів: стандартні теги SEO (title, meta description, канонічний link), теги Open Graph (og:title, og:description, og:type, og:url, og:image, og:site_name) і теги Twitter Card (twitter:card, twitter:title, twitter:description, twitter:image). Маркетологи, блогери та розробники використовують його під час запуску сторінки чи статті, щоб керувати тим, як вона відображається в результатах пошуку Google і як її посилання розгортається у Facebook, LinkedIn, X/Twitter, Slack і Discord. Виберіть og:type (website, article, product, profile або video.other) і стиль twitter:card (summary, summary_large_image, app або player), і інструмент запише лише рядки для тих полів, які ви заповнили. Він виводить звичайні HTML-теги — він не сканує ваш сайт і не читає сторінку замість вас.

Як користуватися Генератор мета-тегів

  1. Уведіть заголовок сторінки — він стане тегами <title>, og:title і twitter:title.
  2. Напишіть мета-опис (близько 150–160 символів) для тегів description, og:description і twitter:description.
  3. Укажіть канонічний URL сторінки та абсолютний URL зображення для попереднього перегляду посилання.
  4. Додайте назву сайту та виберіть og:type і twitter:card у випадних списках.
  5. Скопіюйте згенерований блок HTML із поля виводу та вставте його в <head> вашої сторінки.
  6. Скористайтеся попередніми переглядами результатів пошуку Google і соціальної картки, щоб перевірити результат перед публікацією.

Приклади

Теги для статті блогу

Вхідні дані

Заголовок: How to Bake Sourdough
Опис: A beginner's guide to baking sourdough bread at home.
URL: https://blog.example.com/sourdough
og:type: article

Результат

<title>How to Bake Sourdough</title>
<meta name="description" content="A beginner's guide to baking sourdough bread at home." />
<link rel="canonical" href="https://blog.example.com/sourdough" />
<meta property="og:title" content="How to Bake Sourdough" />
<meta property="og:type" content="article" />
<meta name="twitter:card" content="summary_large_image" />

Соціальна картка з великим зображенням

Вхідні дані

Зображення: https://example.com/og.png
twitter:card: summary_large_image

Результат

<meta property="og:image" content="https://example.com/og.png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://example.com/og.png" />

Спеціальні символи екрануються

Вхідні дані

Заголовок: Tips & Tricks for "Pros"

Результат

<title>Tips &amp; Tricks for &quot;Pros&quot;</title>

Поширені запитання

Які мета-теги створює цей інструмент?
Він створює стандартні теги SEO (<title>, meta description і канонічний link), теги Open Graph (og:title, og:description, og:type, og:url, og:image, og:site_name) і теги Twitter Card (twitter:card, twitter:title, twitter:description, twitter:image). Включаються лише рядки для тих полів, які ви заповнили, тому ви ніколи не отримаєте порожніх тегів-заповнювачів.
Яка різниця між og:type і twitter:card?
og:type повідомляє платформам, який тип обʼєкта представляє сторінка — website, article, product, profile або video.other — що впливає на те, як розгортається посилання. twitter:card вибирає макет у X/Twitter: summary — це маленька мініатюра, summary_large_image показує велике банерне зображення, а app і player призначені для застосунків і медіа. Виберіть пару, що відповідає вашому контенту.
Чи має URL зображення бути абсолютним?
Так. og:image і twitter:image мають бути повними абсолютними URL, що починаються з https://, бо парсери завантажують їх ззовні вашого сайту — відносний шлях на кшталт /og.png не завантажиться. Для найкращого результату використовуйте зображення 1200×630 для великих карток.
Чи сканує цей інструмент мою діючу сторінку або читає її?
Ні. Він лише форматує введені вами значення в HTML-мета-теги. Він не завантажує, не сканує й не аналізує жодних URL — канонічний URL і URL зображення записуються в теги дослівно, без відвідування.
Чи надсилаються мої дані на сервер?
Ні. Теги створюються повністю у вашому браузері за допомогою JavaScript. Ніщо з того, що ви вводите — зокрема неопубліковані заголовки, URL чи описи — не завантажується, не зберігається й нікуди не надсилається, тому інструмент безпечно використовувати на закритих сторінках або сторінках до запуску.

Схожі інструменти

Генератор тегів hreflang

Генерує теги link hreflang для багатомовної сторінки зі списку пар «локаль — URL», з необовʼязковим x-default і самопосильним тегом.

Генератор JSON-LD

Створюйте коректні структуровані дані JSON-LD для схем Article, Product, FAQPage, HowTo, LocalBusiness, Event, Recipe, BreadcrumbList та Organization за допомогою простої форми.

Перевірка щільності ключових слів

Проаналізуйте будь-який текст, щоб підрахувати частоту слів і щільність ключових слів для фраз із 1, 2 або 3 слів, із попередженням про переоптимізацію.

Попередній перегляд Open Graph і соціальних карток

Перегляньте, як посилання розгортається в соціальну картку в X, LinkedIn, Slack, Discord і Facebook на основі заголовка, опису, URL зображення та URL сторінки.