Генератор на мета тагове и Open Graph — безплатно

Как работи

Цялото сглобяване на тагове и анализ на заглавната част се извършва директно във вашия браузър — не участва сървър. Инструментът използва useMemo на React, за да изгражда реактивно HTML низове, и нативния DOMParser API на браузъра, за да чете съществуващо маркиране на страницата за функцията за импорт/одит.

1. 1
   Входът от формуляра движи сглобяването на живо

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

   Всяко поле за URL (URL на страницата, социално изображение) се валидира чрез вградения конструктор URL на браузъра. Преминават само добре формирани адреси http:// или https:// с домейнови имена с точки; невалидни стойности блокират бутона за копиране и показват вградена грешка.
3. 3
   Импорт: DOMParser чете съществуващо маркиране на заглавната част

   Ако поставите съществуващ HTML на <head>, за да го одитирате, инструментът го изпълнява през DOMParser в инертен режим — не се изпълняват скриптове и не се правят мрежови заявки. След това той заявява анализирания документ за известни мета селектори (og:title, twitter:description, canonical link и т.н.) и предварително попълва полетата на формуляра с каквото намери.
4. 4
   Прегледи на живо за Google и социални карти

   Инструментът рендерира стилизиран резултат от търсене в Google и преглед на карта на Open Graph в реално време, използвайки същото състояние на формуляра, така че можете да видите точно как ще бъдат съкратени заглавието и описанието, преди да копирате изхода.

Свързани инструменти