Kako generirati meta oznake i Open Graph oznake za svoju stranicu?

Ispunite Naslov stranice, Meta opis, URL stranice i URL socijalne slike. Oznake se generiraju dok tipkate. Odaberite Format izlaza (HTML, Next.js, JSX ili WordPress), zatim upotrijebite Kopiraj ili Preuzmi i zalijepite blok u svoj head.

Koliko dugi trebaju biti moj naslov i meta opis?

Alat predlaže 30-60 znakova za naslov i 70-160 za opis. Pregled Google pretrage, s prikazima za Računalo i Mobitel, pokazuje kada bi tekst bio odrezan. Širine su procjena jer Google skraćuje prema pikselima.

Zašto moj pregled poveznice ne prikazuje sliku ili prikazuje pogrešnu?

URL slike obično nedostaje, koristi http://, nije javno dostupan ili je platforma spremila stari pregled. Alat preporučuje 1200x630 px, ispod 5 MB, kao apsolutnu https:// poveznicu i upozorava kada omjer ili veličina nisu odgovarajući.

Mogu li provjeriti meta oznake stranice koju već imam?

Da. Otvorite Uvezi iz postojeće HTML datoteke, zalijepite head stranice ili cijeli HTML i kliknite Popuni obrazac iz HTML-a. Odjeljak Provjera zatim navodi probleme. Parsiranje se izvodi u vašem pregledniku i ne pokreće skripte niti išta dohvaća.

Šalje li generator moje podatke o stranici na poslužitelj?

Ne. Oznake se sastavljaju u vašem pregledniku, a zalijepljeni HTML se čita pomoću DOMParser-a preglednika, koji ne izvršava skripte niti šalje mrežne zahtjeve. Samo pregled slike učitava URL slike koji ste upisali.

Je li stvarno besplatno?

Da. Svaki alat je besplatan za korištenje, bez računa i bez kreditne kartice. Rad se odvija na vašem uređaju, a ne na našim poslužiteljima, što omogućuje da ostane besplatan.

Radi li na mobilnim uređajima?

Da. Radi u aktualnim mobilnim preglednicima na iOS-u i Androidu, bez instalacije.

🏷️

Generator meta oznaka i Open Graph-a — besplatno

Generirajte SEO meta oznake, Open Graph i Twitter Card markup s živim Google i pregledom dijeljenja na društvenim mrežama. Kopirajte ravno u zaglavlje stranice.

Radi u preglednikuBez registracije, bez skočnih prozoraNije potrebna prijavaBesplatno zauvijek

Radi offline nakon učitavanja

Naslov stranice0 · 0/580px

URL stranice

Meta opis0 · 0/920px

URL socijalne slike

Najbolje: 1200×630 px, manje od 5 MB, apsolutna https:// poveznica.

Naziv sajta

Twitter/X korisničko ime

Twitter/X oznaka autora

Vrsta Twitter kartice

Open Graph tip

Uključi i

Uključi kanoničku vezu (koristi URL stranice)Skup znakova i mobilni viewportPodsjetnik za postavljanje <html lang> na hrog:locale (jezik stranice)Poveznica na faviconBoja teme (traka preglednika na telefonima)

Indeksiranje u tražilicama

Naslov 0/580px (cilj 30-60)Opis 0/920px (cilj 70-160)

Pregled Google pretrage

example.com

Ovdje se prikazuje naslov tvoje stranice

Ovdje se prikazuje tvoj meta description. Učini ga uvjerljivim kako bi poboljšao/la click-through rate iz rezultata pretrage.

Širine su procjena: Google skraćuje prema pikselima, a ne znakovima.

Pregled socijalne kartice

og:image pregled

example.com

Naslov stranice

Opis stranice

Zalijepi u svoj <head>

Popuni najmanje jedno polje gore da generiš meta oznake.

Uobičajene namjene

Meta oznake za člance na bloguGenerirajte naslov, opis i društvene oznake kako bi članci izgledali sjajno kada se dijele.
Meta oznake za stranice proizvodaUčinite da se stranice proizvoda dijele prekrasno i dobro čitaju u rezultatima pretrage.
Meta oznake za stranice za sletanjePotpuno kontrolirajte kako se stranice za sletanje kampanje prikazuju kada se dijele i pretražuju.
Generirajte meta oznake za bilo koju web aplikacijuBrzo kreirajte kompletan skup glavnih meta oznaka za novu stranicu ili web mjesto.
Ispravite ružne pretpreglede vezaZaustavite prikaz veza kao golih URL-ova — dodajte oznake koje kreiraju kartice s bogatim pretpregledom.

Kako funkcionira

Sve sastavljanje oznaka i raščlanjivanje zaglavlja odvija se izravno u vašem pregledniku — nijedan poslužitelj nije uključen. Alat koristi React useMemo za reaktivnu izgradnju HTML nizova i izvorni DOMParser API preglednika za čitanje postojećeg markupa stranice za značajku uvoza/revizije.

1
Unos obrasca pokreće izgradnju uživo
Dok tipkate, useMemo kuka odmah ponovno sastavlja cijeli blok oznaka — naslov, meta opis, Open Graph svojstva i Twitter Card atribute — escapirajući posebne znakove (&, <, >, ") tako da je izlaz siguran za izravno lijepljenje u HTML.
2
Provjera URL-a putem konstruktora URL preglednika
Svako polje URL-a (URL stranice, socijalna slika) provjerava se koristeći ugrađeni URL konstruktor preglednika. Prolaze samo dobro formirane http:// ili https:// adrese s hostnames s točkama; nevaljane vrijednosti blokiraju gumb za kopiranje i prikazuju ugrađenu grešku.
3
Uvoz: DOMParser čita postojeći markup zaglavlja
Ako zalijepite postojeći <head> HTML za reviziju, alat ga pokreće kroz DOMParser u inertnom načinu — nijedna skripta se ne izvršava, nijedan mrežni zahtjev se ne šalje. Zatim ispituje raščlanjeni dokument za poznate meta selektore (og:title, twitter:description, kanonska poveznica itd.) i unaprijed popunjava polja obrasca svime što pronađe.
4
Pregledi uživo Googlea i socijalnih kartica
Alat renderira stilizirani rezultat Google pretrage i pregled Open Graph kartice u stvarnom vremenu koristeći isto stanje obrasca, tako da vidite točno kako će naslov i opis biti skraćeni prije nego kopirate izlaz.

Srodni alati

📐

Prenosivač veličine slika za društvene mreže

Promijenite veličinu i izrežite slike na točnu veličinu za 2026. godinu za Instagram, YouTube, TikTok, X, Facebook, LinkedIn i Pinterest — s vodičima sigurne zone i grupnog ZIP-a. 100% u pregledniku, bez učitavanja.

IsprobajteDatoteke ostaju lokalne

🎼

Uređivač audio oznaka (ID3)

Uređujte MP3 ID3 oznake — naslov, izvođača, album, godinu, žanr i naslovnicu — 100% u svom pregledniku. Bez prijenosa, a zvuk se ne kodira ponovno. Besplatno i privatno.

IsprobajteDatoteke ostaju lokalne

🔗

Generator slug-ova

Pretvorite bilo koji naslov ili tekst u URL-prikladan slug. Savršeno za blog objave, CMS stranice i SEO-optimizirane URL-ove.

Isprobajte