Facebook FBML és Javascript SDK telepítése – MIÉRT és HOGYAN?

2010. szeptember 30. | Írta: Horváth Oszkár

Teljesen feleslegesnek tartom ezt a sok betűszót bevillantani, de nem tudok mit csinálni, ez a nevük. Gyorsan a válasz két felmerülő kérdésre:

Mi micsoda? Az FBML vagy XFBML a Facebook saját “kis” leíró nyelve, amellyel (ha a lentieken túlesel) egyszerűen használhatod a szolgáltatásait. A Javascript SDK pedig egy programozási segédlet, vagy fejlesztői csomag, a lényege, hogy ahhoz képest, amilyen bonyolult a teljes rendszer, te kapsz egy rém egyszerű programnyelvecskét (az FBML-t, tádá!), amivel használhatod a Facebook szolgáltatásait a weboldaladon. A cikk címe tehát: “a Facebook neked szánt kis programnyelve: miért érdemes használni, és hogyan kell?” Csak erre (remélem) a kutya nem keres rá.

FBML: MIÉRT?

Mert amúgy egy sima Like gombhoz egy ordenáré hosszú kódot kell beillesztened. Ha azonban az oldaladon elérhetők a Javascript SDK szolgáltatásai, akkor két szót kell leírnod FBML-ben. Ha akarsz még egy like boxot is, ahol rajongani lehet az oldaladért, az még újabb 2 szót. Sőt, elérhető összesen 8 social plugin, regisztráció, kommentelés, ezek nagy része pedig csak és kizárólag FBML-ben hozható létre, mint ahogy a Like gomb is csak FBML esetén ajálnja fel lájkolás után, hogy egyből az üzenőfalra is kiküldd a linket, saját szavaiddal ajánlva. Na? Meg is mutatom a különbséget:

FBML nélkül: <iframe src=”http://www.facebook.com/plugins/like.php?href=idejönelinked&amp;layout=standard&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80″ scrolling=”no” frameborder=”0″ style=”border:none; overflow:hidden; width:450px; height:80px;” allowTransparency=”true”></iframe>

FBML esetén: <fb:like></fb:like>

Melyik tetszik jobban? A social pluginek, amelyekről azok álmodozhatnak, akik telepítettek FBML-t az oldalukra:

• Like gomb: egy kattintással megoszthatják a linkedet a látogatók az üzenőfalukon. Ez normál Like gomb esetén csak 1 sorként jelenik meg, az FBML azonban úgy ágyazza be a gombot, hogy a megnyomása után rendes üzenőfali linkként, szöveges ajánlásoddal kiegészítve is elküldheted.
• Activity Feed: megmutatja a látogatóidnak, hogy az ő barátai mit találtak jónak a TE weboldaladon (mit lájkoltak, mire kommenteltek).
• Recommendations (ajánlások): a látogatódnak a Facebook ajánl aloldalakat a te weboldaladról, amelyek – ismerve ízlését – valószínűleg érdekelhetik. Ez a “hasonló cikkek” elég elterjedt szolgáltatáshoz hasonló, csak még annál is okosabb.
• Like Box: ez a már jól elterjedt doboz, ahol az oldal rajongói oldalához tud bárki csatlakozni. Igény esetén megjelenik rajta néhány már csatlakozott tag (a látogatód ismerőseivel az élen), és a projekted Facebook üzenőfaláról néhány friss gondolat.
• Login Button (bejelentkezés gomb): na itt lehet elfelejteni azt, hogy regisztrációt építesz az oldaladba. Aki lájkolja, belép egy kattintással, nem kell megadnia semmilyen adatot, te tudod, hogy ő ő, és ugyanúgy szűrheted a szolgáltatásaidat aszerint, hogy be van-e lépve, és ha be van lépve, akkor ki ő, mi jár neki.
• Facepile (arcképhalmaz): ugyanaz az arcképekből álló sor, ami a Like boxban van, és a látogatód ismerőseit listázza első helyen, de külön használhatod és bárhol elhelyezheted az oldaladon.
• Comments: ahol elhelyezed, ott kiegészíti az oldaladat egy kommentelő résszel. Ezzel és a regisztrációval egy egyáltalán nem webkettes oldalt is gyorsan fel lehet turbózni funkcionálisan, de amúgy is érdekes lehet, hiszen gondolhatod, hogy az itt hagyott hozzászólásnak van utóélete (megjelenik az illető üzenőfalán, illetve a feljebb említett Activity Feed listázhatja, ha a hozzászóló valamelyik ismerőse téved majd az oldaladra).
• Live Stream: ez élő beszélgetést tesz lehetővé, chat funkcióhoz hasonlóan.

FBML: HOGYAN?

Négy lépés a Mennyország:

1. Szükséged van egy application ID-re az oldaladhoz
2. Be kell szúrnod 4-5 sort az oldalad fejlécébe
3. Be kell szúrnod egy ordenáré kódot az oldal láblécébe, a /body elé
4. El kell helyezned a megfelelő, pl. Like boxot jelentő FBML kódot ott, ahol szeretnéd, hogy megjelenjen

Bővebben:

1. Application ID: látogass el a developers.facebook.com/setup címre. Írd be a weboldalad nevét (tetszőleges), a címét (perjellel a végén!), válassz egy nyelvet, és nyomd meg a gombot (“Create application”)! Itt előfordulhat, ha még nem adtál meg mobilszámot (mint magánszemély, Facebook felhasználó), hogy elkéri, és küld egy SMS-t, hogy ellenőrizze, hogy valós személy vagy-e. (Van bankkártyás ellenőrzési lehetőség is, de az SMS talán magyar felhasználók körében népszerűbb.)

Itt kapsz két kódot: App ID és App Secret. Az App ID-t majd be kell másolnod 1-2 helyre, nem titok, nyilvános. A másikat sehová nem kell bemásolnod, de tedd el, ha baj van, szükség lehet rá. (Itt egyébként kapsz egy mintakódot, ami jóval kevesebb, mint amit én itt közzéteszek, ha kimásolod, megérted, akkor már elérted célodat, és készen vagy.)

2. A fejlécben elhelyezendő kódok: az oldalad HTML kódja valahogy úgy kezdődik, hogy <!DOCTYPE …>, aztán jön egy <html>. Nos utóbbi formában kell, hogy kinézzen jó esetben, ebből a dőlt betű, amit az FBML érdekében kell igazából beírni: <html xmlns=”http://www.w3.org/1999/xhtml” xmlns:og=”http://opengraphprotocol.org/schema/” xmlns:fb=”http://www.facebook.com/2008/fbml”>. Miután mi az emotions online ügynökségnél WordPresst használunk mindenre, hozzáteszem, hogy ha mindezt egy WordPress template-ben módosítod, akkor még lehet, hogy egy <?php language_attributes(); ?> még jó, ha ottmarad a végén.

Ezután bárhol a <head> és </head> rész között szükséged van az alábbi néhány sorra:

<meta property=”fb:admins” content=”ide jön a user ID-d“/>
<meta property=”fb:app_id” content=”ide jön a fenti App ID” />
<meta property=”og:type” content=”article” />
<meta property=”og:title” content=”az oldal megnevezése” />
<meta property=”og:url” content=”az oldal URL-je” />

Itt a user ID alatt a te azonosítód mint Facebook magánszemély azonosítója szükséges. Ez nyilvános, ha bárki tudja, hogy te ki vagy, akkor megnézheti, hogy mi az azonosítód, ne sajnáld. De ki kell nyomoznod: kattints a saját adatlapodra, és az URL-ben benne lesz a user ID-d. Ha egyedi URL-t választottál már magadnak, akkor pedig pont fordítva, a graph.facebook.com/ateegyedicimed URL-en meg fogod kapni az ID-det.

3. A weboldalad lábléc részébe, a </body> címke elé másold be ezt:

<div id=”fb-root”></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: ‘ide ismét az App ID jön!‘, status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement(‘script’);
e.type = ‘text/javascript’;
e.src = document.location.protocol +
‘//connect.facebook.net/hu_HU/all.js’;
e.async = true;
document.getElementById(‘fb-root’).appendChild(e);
}());
</script>

4. Illeszd be a megfelelő social plugint, ahová szeretnéd, például tedd ezt a blogbejegyzésed kódja mögé:

<fb:like></fb:like>

ÉS KÉSZ.

Nos, ennyi. Hosszadalmasnak tűnik, de valójában 10 perc az egész, utána pedig kényelem.

Mi a különbség Facebook Group és Page között?

2010. szeptember 10. | Írta: Horváth Oszkár

Ezt már angolul csodásan összefoglalták, de képtelen voltam megjegyezni. Most egy ismerősnek vázlatosan összefoglaltam, és hülye lennék nem kitenni ide nektek is. Pont azért, mert korábban sikerült már indítani Facebook Csoportot, amit aztán 1-2 hónap múlva be kellett zárni, mert rájöttünk, hogy Rajongói oldalt kellett volna mégis. Nos, ha csak ennyire tudod, mi a különbség Facebook Csoport és Facebook Rajongói oldal között, akkor ezt a rossz mozdulatot megspórolhatod.

Van néhány funkció, amit az egyik tud, a másik nem, és néhány, amit a másik tud, és az egyik nem. Hihetetlen nyíltságomnak köszönhetően rátok bízom, melyiket gondoljátok “egyiknek” és “másiknak”, de az állítás felcserélve is igaz marad. Ennyire rafinált.

Facebook Csoport (Group)

• Létrehozás: facebook.com/groups/create.php
• Meghívhatod az ismerőseidet, hogy legyenek tagok. Ezt egy személyes üzenettel bővítheted, amibe bármit beírhatsz, sőt, e-mail címeket is másolhatsz be, amelyek tulajdonosait meg szeretnéd hívni. Ha megnézed, a Rajongói oldalhoz mit írtam, látod, hogy ez több annál.
• Mások is meghívhatják bele a barátaikat, és részükre is működik ez a funkció, külön e-mail üzenet tartozik hozzá, amit ha megkapsz, már a leveleződből nyomhatod a lájkot.
• Itt jön a power: a Group tulajdonosaként tudsz üzenetet küldeni egyből MINDEN TAGNAK. Tedd a szívedre a kezed, ha úgy érzed, spammelni, és/vagy sokaknak kommunikálni akarsz, akkor a Csoport a te barátod.
• Ha üzensz a csoport üzenőfalára, akkor az a tagok üzenőfalán (ha elég friss, vagy elég népszerű) a TE neveden jelenik meg, olyan formában, hogy XY üzeni a Z csoporton keresztül.
• Tudsz csoporteseményt létrehozni, amibe meghívhatod a tagokat.

Kinek is jó ez? Olyan társadalmi szervezeteknek, akiknek sok személyes megjelenése, rendezvénye van. Eleve jó szórakozóhelyeknek, zenekaroknak, rendezvényhelyszíneknek, mert az Események szervesen kapcsolódnak a csoportokról. Ha csoporteseményt hozol létre, azaz pl. a szórakozóhelyeden egy koncertet, akkor pár kattintás és minden tag, aki szeret hozzád járni, kap az eseményről e-mailt + egy kattintással visszajelezhet, hogy jön, nem jön. A Corvintető (official) jó példa arra, hogyan használd aktívan a Csoportot, lépj be, nézd meg, mit csinálnak. A saját céljaimra nekem egyedül egy Terhes férfi madarat szült csoportom van, ami extrém bulvárhíreket gyűjt, és kifejezetten személyes érdeklődésre tart számot, és a csoport tagjaitól ugyanúgy várom a tartalmat, mintha én magam küldeném, ezért ez tényleg csoportmunka, mindenki ugyanolyan tagként posztolhat az üzenőfalra, nincs a középpontban egy kiemelt személy vagy intézmény.

Facebook Rajongói oldal (Page)

• Létrehozás: facebook.com/pages/create.php
• Ajánlhatod ismerőseidnek. De ennyi: kijelölheted, kiknek ajánlod, ők kapnak egy előre fogalmazott üzenetet, hogy neked tetszik valami, és javaslod, hogy csatlakozzanak ők is. De nem hívhatsz meg olyat, aki nem ismerős, tehát ha például van egy hírlevél címlistád 3000 korábbi feliratkozott vendégeddel/ügyfeleddel, akkor őket a Rajongói oldalba nem tudod tömegesen meghívni, ebben az esetben a Csoport a te barátod.
• A Rajongói oldal adminisztrátorai (tulajdonosai) ha írnak az oldal üzenőfalára, akkor az nem az ő személyes nevükön, hanem az oldal nevében jelenik meg. Ettől hivatalosabb, vagy ha úgy tetszik, személytelenebb – attól függ, melyikre van szükséged. Ha egy szervezet, márka vagy termék nevében posztolsz, ez kell neked. Ha álnéven írsz, szintén ez kell neked (figyelem: de csak a saját Rajongói oldaladon belül jelennek meg az üzenetek ezen a néven, amint bárki más oldalára írsz, egy rajongóéra, vagy barátodéra, azonnal a saját neved jelenik meg). Ne feszegessük, hogy ezt az álneves dolgot miért tudom, hiszen ha valaki névvel és arccal blogol, az én vagyok De szoktunk jópofáskodni.
• Egyedül Rajongói oldalnál lehet beállítani, hogy a blogod (vagy bárki más blogja) RSS csatornájából automatikusan vegye át a posztokat, így 0 pluszmunkával már eleve tartalmat adsz a Rajongói oldalnak, és akik nem járnak maguktól vissza a weboldaladra, de amúgy tetszik nekik, azok a népszerű cikkeidről saját üzenőfalukon értesülhetnek. Ez a tartalom persze messze nem elég egy jó Facebook oldalra, de könnyű kiegészíteni.
• És mondanom sem kell, ha van egy jó web2-es technikai tudásod, vagy még jobb, a cégednek van pénze tudást vásárolni, és ezért megkéred az emotions online ügynökséget, hogy segítsen, akkor beállíthatsz egy teljesen egyedi, több RSS-ből álló feedet egy háttérblogra, amit valójában nem használsz, és onnan 1db közös RSS eteti a Facebook oldaladat. Hogy ez miért jó? Például válogathatsz, hogy a 12 rovatodból melyik 8 menjen a Facebookra. Vagy 1 évre előre betárazhatsz mondanivalót, ha valakivel megírattad, mi a cégnél röhögve írunk meg apró bejegyzéseket Excelben, amit aztán elosztunk 2-3 napi gyakoriságra, és egy óra alatt kész egy évnyi tartalom. Megelőzve, hogy egy kitalált személy, nevezzük Andinak, akivel megbeszélted, hogy kétnaponta kitesz valamit a Facebookra, behavazódjon és 1 hónap elteltével teljesen elhanyagolja az oldaladat.
• Egyedi URL-t is csak Rajongói oldalhoz tudsz rendelni, azaz facebook.com/akarmi jellegű címet. Eleve az is egy kisebb titok, és úgy kell rákeresni, hogy ezt hol teheted meg, nos itt: facebook.com/username. Itt választhatsz egyedi URL-t személyes lapodhoz (úgy mint facebook.com/oszkarsag), ennek, ha maga a cím szabad, nincsenek korlátozásai. Rajongói oldaladhoz ugyanilyen módon, akkor választhatsz URL-t, ha már legalább 30 rajongóval rendelkezik az oldal.

Kinek is jó ez? Azoknak, akik egy szervezet, márka vagy termék nevében kommunikálnak, vagy egy weboldalt közösen tartanak fenn, és azt helyezik a középpontba. Ha a Facebook oldalt nem online, hanem szóban, nyomtatásban, rádióban is említeni szeretnéd, itt van lehetőség rövid, jól megjegyezhető facebook.com/akarmi cím választására. És nem különben, ha automatizálva szeretnél rendszeres tartalmat küldeni az oldalt követőknek, RSS-t használva ezt egyedül itt teheted meg. A saját oldalainkhoz kapcsolódó oldalak közül pedig a Bünti Facebook oldalát használjuk viszonylag aktívan. A legsikeresebb magyar Facebook rajongói oldal szerintem a Fuck Yeah Gyakori Kérdések, amely a leglátogatottabb magyar Tumblr oldal Facebook csoportja jelenleg 12.000 taggal, és sikerének kulcsa a naponta többször, előre bejelentve várható állandó tartalom, és a Tumblr oldallal automatizált tartalmi összekapcsolás (RSS).