Бесплатен Генератор на мета ознаки и Open Graph

Како функционира

Целото составување на ознаки и парсирање на заглавие се случува директно во вашиот прелистувач — не е вклучен сервер. Алатката ја користи React useMemo за реактивно градење на HTML низи и природниот DOMParser API на прелистувачот за читање постоечка ознака на страницата за функцијата увоз/ревизија.

1. 1
   Влезот од формулар го води живото составување

   Додека пишувате, кука useMemo веднаш повторно го составува целиот блок ознаки — наслов, мета опис, својства Open Graph, и атрибути Twitter Card — ескејпирајќи специјални карактери (&, <, >, ") така што излезот е безбеден за директно залепување во HTML.
2. 2
   Проверка на URL преку конструкторот URL на прелистувачот

   Секое поле за URL (URL на страница, социјална слика) се проверува користејќи го вградениот конструктор URL на прелистувачот. Само добро формирани адреси http:// или https:// со домени со точки минуваат; неважечки вредности го блокираат копчето за копирање и прикажуваат внатрешна грешка.
3. 3
   Увоз: DOMParser чита постоечка ознака на заглавие

   Ако залепите постоечки <head> HTML за ревизија, алатката го извршува преку DOMParser во инертен режим — не се извршуваат скрипти и не се прават мрежни барања. Потоа го пребарува парсираниот документ за познати мета селектори (og:title, twitter:description, canonical link, итн.) и однапред ги пополнува полињата на формуларот со сè што ќе најде.
4. 4
   Живи прегледи на Google и социјални картички

   Алатката исцртува стилизиран резултат од пребарување на Google и преглед на Open Graph картичка во реално време користејќи ја истата состојба на формуларот, така што можете да видите точно како ќе бидат скратени насловот и описот пред да го копирате излезот.

Поврзани алатки