Osnove Open Graph protokola
Open Graph protokol (OGP) je set instrukcija čija je namena da naglasi naslov, opis, URL i sliku web sajta, a koji se deli putem društvene mreže Facebook.
Open Graph protokol je kreiran od strane inženjera kompanije Facebook 2010. godine i koristi se samo i isključivo za kontrolu povezivanja i deljenja sadržaja na ovoj društvenoj mreži.
Osnovna svrha OGP protokola
Osnovna svrha ovog protokola jeste da naglašeni sadržaj integriše i prikaže na Facebook društvenoj mreži i kontroliše njegov izgled, odnosno kako će naglašeni sadržaj biti prikazan.
Facebook uz pomoć OG protokola preuzima naslov (og:title), opis (og:decription), URL adresu (og:url), sliku (og:image) i dimenzije slike (og:image:width, og:image:height), jezik (og:locale), tip objekta (og:type), naziv web sajta (og:site_name), broj stranice administratora Facebook profila (fb:admin) i broj Facebook aplikacije koju je kreirao administrator (fb:app_id) web sajta, web stranice, bloga ili blog članka koji će biti preuzet prilikom deljenja (URL share) ili lajkovanja stranice (Page like).
Integracija OGP protokola u web stranicu
OGP se integriše u web stranicu tako što se dodaje u njen <head>
meta element. Za integraciju ogp protokola potrebno je uneti prefiks i definisati attribute što možete učiniti ukoliko budete sledili tutorial koji smo napisali u 9 jednostavnih koraka:
- Prvi korak je da naglasimo i dodamo prefiks u
<head>
meta elementu i na taj način naglasimo da je OGP prisutan u kodu stranice:<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">
- Zatim je potrebno da dodamo naslov web sajta ili web stranice:
<meta property="og:title" content="Website title" />
- Treći korak bi bio dodavanje opisa web sajta (najbolje do 156 karaktera uključujući razmake):
<meta property="og:description" content="Website description" />
- Četvrti korak je da unesemo tag sa URL adresom stranice:
<meta property="og:url" content="Website URL address" />
- Zatim je potrebno da naglasimo i odredimo URL slike koja će biti upotrebljena prilikom deljenja
ili
lajkovanja stranice na Facebook društvenoj mreži:
<meta property="og:image" content="Website image URL" />
- Ovde je potrebno upisati dimenzije slike iz prethodnog koraka:
<meta property="og:image:width" content="Website image width" />
<meta property="og:image:height" content="Website image height" />
- Sedmi korak je upisivanje naziva web sajta, bloga, privatnog lica ili kompanije:
<meta property="og:site_name" content="Website name" />
- Osmi korak predstavlja dodavanje i određivanje tipa objekta, to podrazumeva odabir taga koji
najbolje
opisuje da li je u pitanju websajt, lični portfolio, autor, knjiga, restoran, blog ili blog
članak i td:
<meta property="og:type" content="Website type" />
Trenutno dostupni objekti su (website, article, book, books.author, books.genre, business.business, fitness.course, music.album, music.musician, music.playlist, music.radio_station, music.song, object, place, product, product.group, product.item, profile, quick_election.election, restaurant, restaurant.menu, restaurant.menu_item, video.episode, restaurant.menu_section, video.movie, video.tv_show, video.other).
*Moguća je izmena postojećih ili dodavanje novih atributa objekata usled kontinuiranog razvoja Open Graph Protokola.
- Poslednji korak je dodavanje ID broja privatnog Facebook profila administratora sa kojeg
je
kreirana Facebook stranica kompanije:
<meta property="fb:admins" content="Facebook admin Id number" />
ili dodavanje ID broja Facebook aplikacije koju ste kreirali sa administratorskog Facebook profila:
<meta property="fb:app_id" content="Facebook application Id number" />
Open Graph Facebook isečci
Primer kako izgleda stranica koja se deli na Facebook društvenoj mreži:
Connecting the website with Facebook profile via #OpenGraph Protocol
Posted by PopArt STUDIO on Friday, September 11, 2015
Primer kako izgleda Open Graf protokol u kodu stranice na kojoj se trenutno nalazite:
<head lang="sr" prefix="og: http://ogp.me/ns#">
<meta property="og:title" content=" Šta je (OGP.me) Open Graph Protokol " />
<meta property="og:type" content="website" />
<meta property="og:url" content=" https://www.popwebdesign.net/sta-je-ogp.html " />
<meta property="og:image" content=" https://www.popwebdesign.net/img/open-graph-protocol.png " />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:site_name" content="PopArt Studio" />
<meta property="fb:admins" content="100000505383935" />
<meta property="og:description" content=" Open Graph protokol (OGP) je set instrukcija
koje služe za naglašavanje naslova, opisa, URL i slike web sajta a koji se deli putem društvene mreže Facebook." />
Pročitajte još:
- Kako napraviti Facebook aplikaciju za web sajt?
- Šta je SMM?
- Šta je Twitter cards?
- Online Open Graph protokol generator alat
Spoljašnje veze i izvori:
- Zvanična stranica na kojoj možete naći detaljne instrukcije OGP protokola.