OG i Twitter Card Generator – Izrada, revizija i pregled meta oznaka
Izradite gotove za kopiranje Open Graph i Twitter Card <meta> oznake iz obrasca ili zalijepite postojeći <head> da biste provjerili nedostaju li oznake, duljinu naslova/opisa i valjanost twitter:card – zatim pregledajte oboje u vjerno stiliziranim maketama poveznica za Twitter/X, Facebook, LinkedIn i Discord.
🔒 U potpunosti se obrađuje u vašem pregledniku — ništa što ovdje unesete nikada se ne učitava.
Rezultat
Open Graph i Twitter Card meta oznake određuju kako poveznica izgleda u trenutku kad je zalijepite u Slack, iMessage, tweet ili Discord kanal – naslov, opis i sliku bira <head> same stranice, a ne ono što platforma slučajno pokupi iz vidljivog teksta. Ovaj alat služi i za izradu i za reviziju, a ne za generičko popunjavanje predloška. U načinu rada BUILD unesite naslov, opis, URL slike, kanonski URL, vrstu sadržaja i vrstu Twitter kartice, a alat će sastaviti točan blok <meta property="og:..."> i <meta name="twitter:..."> oznaka spreman za kopiranje u <head> vaše stranice, preskačući svako polje koje ostavite praznim umjesto da generira prazne oznake.
U načinu rada AUDIT zalijepite postojeću <head> oznaku ili cijeli HTML stranice, a alat će je obraditi pomoću ugrađenog DOMParsera preglednika kako bi izdvojio sve već postojeće og: i twitter: meta oznake, a zatim provodi provjere koje su zaista važne: četiri najčešće obavezne oznake (og:title, og:description, og:image, og:url) označavaju se ako nedostaju; og:title se mjeri u odnosu na granicu od otprilike 60 znakova na kojoj ga neke platforme počinju skraćivati i otprilike 90 znakova na kojoj će to učiniti većina; og:description se mjeri u odnosu na raspon od otprilike 155 do 200 znakova koji većina platformi dopušta prije kraćenja; twitter:card se provjerava u odnosu na četiri stvarne vrijednosti koje Twitter Card validator prihvaća – summary, summary_large_image, app, player – i označava ako je bilo što drugo; a duplicirane oznake (isto svojstvo deklarirano dvaput, iznenađujuće česta pogreška pri kopiranju) navode se poimence.
Dimenzije slike obrađuju se iskreno: ovaj alat ne može provjeriti stvarnu veličinu slike u pikselima bez da je dohvati i namjerno to nikada ne čini, u skladu s politikom web-mjesta o izbjegavanju vanjskih zahtjeva. Ako vaš HTML već deklarira og:image:width i og:image:height, ti se navedeni brojevi provjeravaju u odnosu na općeprihvaćeni minimum od 1200×630; ako ne, dobit ćete jasnu napomenu umjesto izmišljenog prolaza ili pada. Oba načina rada prikazuju iste četiri makete pregleda poveznica – Twitter/X (koji mijenja između kompaktnog prikaza sa „summary” minijaturom i „summary_large_image” prikaza preko cijele širine ovisno o vrijednosti twitter:card), Facebook, LinkedIn i Discord – svaka je vjerno stilizirana u skladu s tipografijom i konvencijama izgleda te platforme, a ne kao ista kutija s drugačijim logotipom, i svaka je jasno označena kao ilustrativna aproksimacija za potrebe planiranja, budući da stvarne platforme s vremenom mijenjaju izgled svojih pregleda, a ovaj alat ih nikada ne dohvaća niti ne analizira kako bi to provjerio.