Előrebocsátom, hogy a Facebookon állandó a fejlődés, a változás.
Ezért van az, hogy amit ma olvasunk, sajnos néhány hónap múlva már nem biztos, hogy igaz, illetve nem biztos, hogy egy műveletet ugyanúgy kell végrehajtani.
Node sebaj, mert így legalább állandó téma tud lenni a Facebook és annak a működése, no meg a különböző funkciók bepasszírozása honlapjainkba.
A Like gombot hogyan tegyük fel honlapunk oldalsávjába, szól a kérdés.
Tegyük fel, hogy rendes html oldalról beszélünk, ahol stíluslapot is használunk.
Tehát ez a leírás nem a blog-ra vonatkozik.
Ha a Bloggeres blogban kell elhelyezni Like gombot, akkor a
Like gomb a Bloggerben bejegyzést ajánlom elolvasásra.
Először is elzarándokolunk a Facebookra, és saját profilunkban vagyunk. (Nem oldalként vagyunk bejelentkezve)
A like gomb kódjának megtalálása, ha emberként vagyunk bejelentkezve macerás, tehát egyszerűbb, ha ezt a linket követjük:
https://developers.facebook.com/docs/reference/plugins/like/
Itt már angolul cseveg velünk a Facebook.
Mutatja is, mit vár el tőlünk.
 |
| Like gombot generáltatunk |
A
Step 1 arról szól, hogy mondjuk meg, melyik honlapról van szó, és hogyan akarjuk formázni a Like gombot és környékét.
URL to Like alá be kell gépelni annak a honlapnak a címét, amire a Like gombot tenni akarjuk. Nem szabad elfelejteni a http:// részt sem, és ha csak www-vel érhető el az oldal, akkor azt sem.
A példában nálam is ki van töltve ez a sor.
Utána jön az
XFBML Only rész, na, ezt a pipát vegyük ki innen!
Következik a
Layout Style. Itt lehet 3 kinézet között választani. Amelyik tetszik, annak a nevét lássuk a panelen!
Width - vagyis a Like gombos részünk szélessége.
Ha oldalsávban akarjuk elhelyezni, biztos széles az alapból felajánlott 450 pixeles szélesség.
Meg kell nézni, milyen széles az oldalsávunk, és itt, a Facebookon kell elkezdeni játszani a szélesség beállításával. Ez azért jó, mert mindig látjuk az eredményt, ha beállítunk egy szélességet, és valahol a lapon kattintunk utána. Persze normális szélességek választása esetén.
Ha szeretnénk látni a lájkolók képét is, akkor hagyjuk bent a pipát a
Show Faces szöveg alatt.
Like vagy recommend feliratú gomb között lehet választani jelenleg.
A
Color Scheme segítségével fehér vagy fekete hátterünk lehet. (A Like gombos résznél.)
Ez azért jó, mert így a honlapunkhoz jobban illeszkedőt választhatjuk, persze direkt az elütő színűt is választhatjuk.
A
Fontnál néhány betűtípust találunk, ezek közül választhatunk, és akkor a honlapunk szövege és a Like gombhoz tartozó szöveg ugyanolyan betűtípusú lehet.
Amikor minden beállítás készen van, az eredmény tetszik, akkor megnyomjuk a
Get Code feliratú gombot.
Na, ekkor jön a feketeleves.
Merthogy sokféle kód van. Melyiket válasszam?
Az első a
HTML5. Ha ilyen kódban van a honlapunk (nem hiszem, hogy ebben van), akkor ez a jó kód, ezt kell kimásolni.
Ha tudjuk, hogy xhtml valamelyik variációja, akkor az első nem jó nekünk.
A második biztos, hogy nem jó, ha honlapra akarjuk tenni, tehát az IFRAME verzió a mi kódunk.
Az
IFRAME-s kódot másoljuk ki egy az egyben innen, és a honlapunk html kódjába kell illesztenünk.
Méghozzá oda, ahol szeretnénk, hogy megjelenjen. Ez egy okos mondat, igaz is, de!
Ugye stíluslapunk is van, és a különböző helyek valamilyen elnevezéssel bírnak.
Ha ez nem igaz, mert egyszerű, mezei html kódolásunk van, azt sem tudjuk, mi az a CSS, akkor valóban ott lesz a Like gomb, ahova beillesztjük.
Más esetben, tehát, ha stíluslapokkal is dolgoztunk, akkor megkeressük az oldalsáv kódolását, és oda illesztjük be a kódot.
Elmentjük a változtatást, és frissítjük az oldalt.
A fentieket most is kipróbáltam, működik.
Mi lehet a hiba, ha nem látunk semmit, vagy nem azt, amit várunk?
- HTML5 kódolást illesztettünk be a honlapunkba, ami HTML4 vagy XHTML kódolású
- XFBML-t illesztettünk be a HTML oldalba
- Próbafájlunk a saját gépünkön van, és így nézzük meg böngészőben.
Ha a Like gombot működve szeretnénk látni, akkor azt egy igazi, éles honlapon helyezzük el.
Ha félünk, elrontunk valamit, akkor az egyik oldalunkat mentsük el más néven, én úgy csináltam, hogy a fájlnév mögé egy számot biggyesztettem, és ebbe illesszük be a Like gomb kódját, mentsük el, töltsük fel a tárhelyre.
Nyissuk meg azt az oldalt, amit más néven elmentettünk, ekkor látjuk, nincs Like gomb rajta, majd a címsorba írjuk be a mentés máskéntnél adott számot a fájl neve mögé, de a .html elé, és nyomjunk entert.
Akkor látnunk kell a próbaoldalon a Like gombot.
Ha jó helyen van, nincs más dolgunk, mint a honlapunk minden oldalára beilleszteni, ugyanerre a helyre.
Ha nincs jó helyen, nézzük meg, hol kellene lennie, hol nézne ki jobban, és tegyük át oda, majd ismét ellenőrizzük.
Tehát összefoglalva, ha Like gombot akarok a honlapomra:
- Facebookon kell a kódot generáltatnom, a fenti linkre kattintva könnyen elérhető helyen.
- A generált kódok közül ajánlott az IFRAME választása.
- Ezt a kódot kell a forrás megfelelő helyére illeszteni.
- Online kell kipróbálni a kód működését.
Remélem, a leírás alapján sikerül a honlapra Like gombot varázsolni!
