Facebook XFBML használat
Like button, like box, facepile, kommentek... a közösségi pluginek könnyű használatát kétféleképpen segíti a Facebook, Iframe és XFBML technikákkal. Ezek használatának gyors és rövid bemutatása következik
Lássuk a rugalmatlanabb, de könnyebb használatot ígérő Iframe-t.
A FB Iframe kódot csak beilleszted és működik
Használata tényleg egyszerű, a Facebook segítségével beállítgatod, hogy milyen kinézetet szeretnél egy közösségi pluginnek és a "Get Code" gomb már adja is a beillesztendő Iframe kódot. Mint a Facebook is írja az XFBML kód sokkal rugalmasabb, ezért használata ajánlott. Például a következő közösségi pluginek nem is használhatók Iframe alapon:
Ezeknél a plugineknél, ne is keressük az Iframe kódot, nincs.
Térjünk is át az XFBML-re, mely megköveteli a Javascript SDK használatát.
És itt, ki is térnék arra, hogy tegnaptól (2011.03.15.) a Facebook szigorúan megköveteli a Javascript SDK-ban megadott formát az XFBML meghívásoknál, értem ez alatt, hogy eddig elég volt beilleszteni egy közösségi plugin XFBML kódját a honlapba, működött. Ennek viszont vége, a honlapnak a következő kódot kell tartalmaznia ahhoz, hogy a beszúrt XFBML kód működjön:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
Alkalmazások esetében pedig:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
Az ajánlások szerint ezt a kódot a < body > tag után tegyük közvetlenül.
Mindkét esetben látható, hogy beszúrásra kerül egy "fb-root" azonosítóval ellátott < div >, ebben fog ténykedni a Facebook scriptje, ne zavarjon minket. Az viszont zavaró, hogy a "Get Code" gomb után az XFBML kód ajánlásnál nem mindenhol szerepel ez a tag. Ezért a következőképpen alakul egy plugin beszúrása.
Like Button beszúrása:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like href="" show_faces="true" width="450" font=""></fb:like>
Fontos, hogy a "<div id="fb-root"></div>" sor mindig előzze meg a rákövetkező scriptet, különben a következő hibaüzenetet kapjuk a javascript konzolban:
The "fb-root" div has not been created.
így kiegészítve a kódot, biztosan kell, hogy működjön.
Ha valakinek esetleg magyarítva kell a szolgáltatás, akkor a < script > tag-ban szereplő .../en_US/all.js -t kell lecserélni .../hu_HU/all.js -re. A lokalizációkról itt olvashattok bővebben.
