Preskoči na sadržaj
1001 Tools
en
Alati za programere

Generator meta tagova

Meta tagovi govore pretraživačima i društvenim mrežama kako da prikažu vašu stranicu. Unesite naslov, opis, URL i sliku za pregled, a alat ispisuje odgovarajuće SEO, Open Graph i Twitter Card tagove kao čist HTML koji nalepite u <head> stranice. Vrednosti se eskejpuju za vas, a ništa se ne otprema.

0ciljajte 50–60 znakova

0ciljajte 150–160 znakova

Meta tagovi
Podeli FacebookXLinkedInWhatsAppViber

Kako radi

Alat pravi tri grupe tagova. SEO grupa je <title>, meta opis i kanonski link. Open Graph grupa (og:*) određuje kako stranica izgleda kada se deli na Fejsbuku, LinkedInu, Vocapu i većini aplikacija za ćaskanje. Twitter grupa (twitter:*) radi isto za objave na X-u/Tviteru.

Tagove prave samo polja koja popunite, pa stranica bez slike za pregled jednostavno izostavlja tagove slike. Svaka vrednost se HTML-eskejpuje — navodnici, ampersandi i uglaste zagrade pretvaraju se u entitete — pa naslov poput Tom & „Jerry“ ne može da pokvari atribut ni da ubaci markap.

Open Graph i Twitter se namerno preklapaju: slika, naslov i opis se ponavljaju u obe grupe jer svaka platforma čita svoj imenski prostor. Postavite og:type (website ili article) i stil Twitter kartice, pa kopirajte ceo blok u <head> vašeg HTML-a, po mogućstvu pri vrhu.

Primeri iz prakse

Članak na blogu

Naslov „Kako skuvati filter kafu“, opis u jednoj liniji, URL članka, slika 1200×630 i og:type „article“. Nalepite izlaz u šablon objave i deljenja na mrežama prikazuju pravu karticu sa slikom.

Prodajna stranica proizvoda

Postavite og:type „website“, dodajte fotografiju proizvoda kao sliku i izaberite Twitter karticu sa velikom slikom. Linkovi objavljeni u aplikacijama za ćaskanje se tada otvaraju sa fotografijom umesto golog URL-a.

Popravka golog pregleda linka

Ako se vaši linkovi trenutno dele bez slike ili sa pogrešnim naslovom, ovde napravite og:title, og:description i og:image tagove, dodajte ih i ponovo testirajte u alatki za otklanjanje grešaka deljenja da osvežite keš.

Česta pitanja

Čemu služe meta tagovi?

Daju mašinama sažetak vaše stranice: pretraživači koriste naslov i opis u rezultatima, a društvene mreže koriste Open Graph i Twitter tagove da naprave karticu za pregled koja se prikazuje kada se vaš link podeli.

Koja je razlika između meta opisa i Open Graph opisa?

Meta opis cilja pretraživače i pojavljuje se u listi rezultata. og:description je za deljenja na mrežama i pojavljuje se u kartici za pregled. Često su isti tekst, i ovaj alat popunjava oba iz jednog polja.

Koju veličinu slike da koristim za Open Graph?

Uobičajen i siguran izbor je 1200×630 piksela (otprilike 1,91:1). Koristite apsolutni URL, držite fajl ispod oko 5 MB i pobrinite se da je javno dostupan — pretraživači mreža ne vide slike iza prijave.

Koliko dugačak da bude naslov i opis?

Ciljajte naslov od oko 50–60 znakova i opis od oko 150–160 da ne budu skraćeni u rezultatima pretrage. Alat prikazuje broj znakova uživo da vam pomogne da ostanete u opsegu.

Da li mi trebaju i Open Graph i Twitter tagovi?

Sam Open Graph često radi, jer se X i mnoge aplikacije vraćaju na og:* tagove. Dodavanje izričitih twitter:* tagova daje vam preciznu kontrolu nad X/Twitter karticom, poput izbora velike slike umesto malog sažetka.

Šta radi kanonski tag?

Govori pretraživačima koji je poželjni URL stranice, čime se sprečavaju problemi sa dupliranim sadržajem kada je isti sadržaj dostupan na više adresa. Usmerite ga na čistu, kanonsku verziju URL-a.

Zašto ste eskejpovali znakove u mom tekstu?

Vrednosti atributa ne smeju sadržati sirove navodnike ili uglaste zagrade, jer bi pokvarile tag ili omogućile ubacivanje markapa. Alat automatski pretvara &, <, >, " i ’ u bezbedne HTML entitete.

Pregled i dalje prikazuje staru sliku — zašto?

Platforme keširaju preglede. Nakon ažuriranja tagova, upotrebite alatku platforme za deljenje ili otklanjanje grešaka (na primer Facebook Sharing Debugger) da nametnete ponovno očitavanje, ili sačekajte da keš istekne.

Gde tačno idu ovi tagovi?

Unutar <head> elementa vašeg HTML-a, pre zatvarajućeg </head>. Postavljanje visoko u head-u pomaže pretraživačima koji čitaju samo prvi deo dokumenta.

Srodni alati