Líbí se vám tlačítko ‘Like’ od Facebooku? Dejte si ho na stránky!
27. 4. 2010 | Honza
Facebook minulý týden představil zcela nové funkce, které mají posunout Facebook a potažmo celý web zase o krok kupředu. Zastánci tzv. otevřeného webu Facebook často kritizují, že jejich poslední krok není v zájmu uživatelů ani dalšího vývoje webu. Ponechme stranou tyto diskuse a pojďme se podívat, co Facebook nabízí majitelům webových stránek.
Dobrým začátkem může být adresa http://developers.facebook.com, kde Facebook poskytuje vývojářům webu a majitelům stránek veškeré aktuální informace. Řekněme, že máme stránky a chceme je „nějak“ propojit s Facebook. Proč to dělat? Protože na Facebooku je v současné chvíli na celém světě více než 400 milionů lidí, v České republice to budou brzy 3 miliony uživatelů. A to není zanedbatelné číslo. Jde o trh, který nás může, či musí – doplňte sami, zajímat. Navíc je Facebook zřejmě druhým nejnavštěvovanějším webem po Seznamu.
Sociální pluginy – dobrý začátek
Nejjednodušším způsobem, jak využít Facebook pro své stránky, je využít některý z připravených tzv. sociálních pluginů. Z nich je nejpoužívanější tlačítko „Like“ – „Líbí se mi“. Pokud se ocitnete na stránkách, kde je vloženo toto tlačítko, můžete jako uživatel stisknutí tlačítka deklarovat, že se vám daná věc, odborně nazvaná sociální objekt, líbí. Může jít o danou webovou stránku, může jít o film, o kterém je na stránce řeč, může jít o vaši oblíbenou restauraci, o vaši oblíbenou značku piva, hudební skupinu apod. Kompletní seznam toho, co se vám může líbit najdete na http://developers.facebook.com/docs/opengraph#types.
Nás bude v první řadě zajímat, jak tlačítko „Like“ na své stránky vložit. Jednoduše. Běžte na http://developers.facebook.com/docs/reference/plugins/like, kde najdete formulář, který vám vygeneruje kód, který si vložíte do HTML kódu vašich stránek. Pokud se má uživatelům líbit vaše webová stránka, pak vložte její adresu do formuláře. V našem případě vložíme adresu testovacího webu www.jein.cz. Ostatní pole můžete nechat tak, jak jsou.

Po zmáčknutí „Get Code“ nám naskočí toto okno:

Na výběr máme 2 možnosti, jednodušší je pracovat s iframe kódem (1. možnost). V případě využití XFBML verze pluginu bychom museli navíc pracovat s Javascriptovým SDK, odměnou za zvýšenou námahu nám však bude to, že uživatelé budou kromě triviálního mačkání tlačítka také zadat slovní komentář. Druhá varianta nabízí také širší možnosti nastavení vzhledu tlačítka „Like“.
Zvolíme-li tedy první možnost, kód vložíme do našich stránek, stránku nahrajeme na web a návštěvníci mohou veseli „lajkovat“. Bohužel tím většina uživatelů končí. Výhodou je to, že jakmile návštěvník webu zmáčkne „Like“, tak se jeho přátelům na Facebooku ukáže zpráva typu „Pepovi se líbí to nebo vono“.
Přidejme trošku sémantiky
Výše popsaný návod je dobrý začátek, Facebook však můžeme s trochou dalšího úsilí integrovat mnohem hlouběji. Takže by jistě byla škoda to neudělat. Využijme příkladu s ukázkovým webem www.jein.cz, kde je implementováno tlačítko Like a také několik Activity Feed pluginů. Když se podíváte do zdrojového kódu stránky, v hlavičce uvidíte následující informace (metadata):
<html xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta property="og:title" content="Co je právě in?"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://www.jein.cz/"/>
<meta property="og:image" content="http://www.jein.cz/images/jein.png"/>
<meta property="fb:admins" content="669384918"/>
<meta property="og:description" content="Co je právě in na českém internetu aneb co se líbí českým uživatelům Facebooku."/>
<meta property="og:email" content="jan.horna@gmail.com"/>
Právě výše uvedené řádky kódu způsobují ono kouzlo, které Facebook před týdnem představil světu. Co nám uvedená metadata říkají?
- nastavení nadpisu stránky:
property="og:title" content="Co je právě in?" - typ obsahu – objektu:
property="og:type" content="website" - URL dané stránky, použije se pro typ „website“:
property="og:url" content="http://www.jein.cz/" - URL obrázku (ideálně rozměr 50 x 50 pixelů):
property="og:image" content="http://www.jein.cz/images/jein.png" - ID uživatele Facebooku, který bude administrátorem:
property="fb:admins" content="669384918" - slovní popis (věta či dvě):
property="og:description" content="Co je právě in na českém internetu aneb co se líbí českým uživatelům Facebooku." - můžeme doplnit vlastní email:
property="og:email" content="jan.horna@gmail.com"
Jakmile máme na své stránce tato metadata v hlavičce HTML souboru, tak stačí kliknout na tlačítko „Like“ a hned můžeme vidět výsledek:

Pokud klikneme na odkaz „Admin Page“, tak se dostáváme dovnitř Facebooku:

Facebook správci dané webové stránky, tedy www.jein.cz, vytvořil uvnitř Facebooku administrační stránku, kde můžete vašim fanouškům například posílat zprávy. A aby toho nebylo málo, tak každému, kdo zmáčkne na dané stránce tlačítko „Like“, se automaticky aktualizuje seznam jeho oblíbených stránek na Facebooku:

Tak už je vám jasné, o čem mluvil minulý týden zakladatel Facebooku šestadvacetiletý Mark Zuckerberg?
Shrňme to
Facebook umožňuje napojit na svou sociální síť (označuje se někdy jako tzv. sociální graf) vlastní webové stránky, které s Facebook zatím nijak nesouvisí. S Facebookem můžeme integrovat také další sociální objekty (oblíbená restaurace nebo film). Dělat to budeme proto, že prostředí Facebooku slouží jako komunikační kanál, který šíří povědomí o našich webových stránkách, výrobcích či službách, prostě o tom, co má kdo v oblibě. Slovní spojení „word-of-mouth“ se tak mění ve „word-of-mouse“.
Pingback: Tweets that mention Líbí se vám tlačítko ‘Like’ od Facebooku? Dejte si ho na stránky! | Hosting.cz -- Topsy.com
Pingback: Sociální pluginy od Facebooku – šance pro váš web | Hosting.cz