Генератар мета-тэгаў і Open Graph — бясплатна

Як гэта працуе

Уся зборка тэгаў і разбор galoWка адбываецца непасрэдна ў вашым браўзеры — сервер не задзейнічаны. Інструмент выкарыстоўвае useMemo React, каб рэактыўна будаваць радкі HTML, і нацыўны DOMParser API браўзера, каб счытваць існуючую разметку старонкі для функцыі імпарту/аўдыту.

1. 1
   Увод формы кіруе жывой зборкай

   Пры наборы хук useMemo неадкладна перабудоўвае поўны блок тэгаў — назву, мета-апісанне, уласцівасці Open Graph і атрыбуты Twitter Card — экранiруючы спецыяльныя сімвалы (&, <, >, "), так што вывад бяспечны для ўстаўкі непасрэдна ў HTML.
2. 2
   Праверка URL праз канструктар URL браўзера

   Кожнае поле URL (URL старонкі, сацыяльны малюнак) правяраецца з дапамогай убудаванага канструктара URL браўзера. Праходзяць толькі правільна сфармаваныя адрасы http:// ці https:// з дамен-імёнамі, якія ўтрымліваюць кропкі; няправільныя значэнні блакуюць кнопку капіравання і паказваюць убудаваную памылку.
3. 3
   Імпарт: DOMParser счытвае існуючую разметку galoWка

   Калі вы ўстаўляеце існуючы HTML <head> для аўдыту, інструмент прапускае яго праз DOMParser у інертным рэжыме — ніякія сцэнарыі не выконваюцца і ніякія сеткавыя запыты не робяцца. Потым ён запытвае разабраны дакумент на вядомыя селектары мета (og:title, twitter:description, canonical link і г.д.) і папярэдне запаўняе палі формы тым, што знойдзе.
4. 4
   Жывыя папярэднія прагляды Google і сацыяльных карт

   Інструмент рэндэрыць стылізаваны вынік пошуку Google і папярэдні прагляд карты Open Graph ў рэальным часе, выкарыстоўваючы той жа стан формы, так што вы можаце ўбачыць дакладна, як будуць абрэзаны назва і апісанне, перад тым як капіяваць вывад.

Звязаныя інструменты