Logowanie z Facebook'iem - Login Button - wakacyjny kurs Facebook'a

Facebook udostępnia w ramach social plugin przycisk logowania - można go wykorzystać m.in. do zalogowania do komentarzy, a także po zalogowaniu użytkownika mamy dostęp do jego podstawowych informacji (jeżeli je udostępnił). Dane te można wykorzystać później np. w dostosowywaniu treści do zainteresowań użytkownika. Umieszczanie przycisku jest bardzo proste - a i możliwości dostosowywania są stosunkowo duże.


Warunkiem skorzystania z przycisku jest skonfigurowanie pola Connect URL w zakładce Połącz w konfiguracji aplikacji. Strona internetowa wykorzystująca ten plugin musi się niestety znajdować pod podanym adresem URL.


Przycisk logowania można skonfigurować za pomocą kreatora - natomiast podobnie jak w przypadku komentarzy jego możliwości są mocno ograniczone. Do ustawienia pozostaje nam:
  • szerokość (width)
  • ilość wierszy ze znajomymi (rows)
  • możliwość włączenia wyświetlania znajomych, którzy także używają aplikacji (show-faces) - tego parametru nie ma w dokumentacji

W przypadku skorzystania z dokumentacji do pluginu Login Button znajdziemy kilka innych ciekawych opcji. Atrybuty, które możemy ustawić to m.in.:
  • rozmiar (size) - dopuszczalne wartości:
    • tylko ikona (icon)
    • mały (small)
    • średni - domyślny (medium)
    • duży (large)
    • ekstra duży (xlarge)
  • automatyczne wylogowywanie (autologoutlink) - po zalogowaniu tekst zmienia się na Wylogowywanie z Facebook'a i po kliknięciu wylogowuje użytkownika i znów zmienia się w zaloguj się - w momencie zastosowania opcji show-faces przycisk ten się nie pokazuje

    Dodatkowo można zdefiniować wyświetlany tekst zamiast domyślnego Zaloguj się - wystarczy między znacznikami umieścić tekst.
    <fb:login-button autologoutlink="true">Mój tekst</fb:login-button>

    Niestety są też pewne ograniczenia - tekst wyświetla się cały czas (zarówno jak jest zalogowany jak i nie), a w przypadku użycia go w trybie show-faces, kiedy użytkownik jest zalogowany tekst jest umieszczany jako nieostylowany.
    Z dodatkowymi możliwościami logowania i konfigurowania przycisku logowania można zapoznać się w artykule Authenticating Users with Facebook Connect.

    Miłego logowania!

    Prześlij dalej:

    9 komentarzy:

    jacekks pisze...

    śmieszna rzecz; nie moge znalezc tego przycisku na stronie fb w wersji z polskim napisem :)

    Michał Biniek pisze...

    z tego co zauważyłem tekst się automatycznie dopasowuje do wersji językowej strony lub użytkownika - jak testowałem na FB to tekst jest angielski, z kolei jak testowałem na swoim testowym serwerze to już tekst został przetłumaczony na Zaloguj się

    Jacek Smolak pisze...

    Możesz wymusić pobieranie polskiego connecta zmieniając w linku locale:
    e.src = document.location.protocol + '//connect.facebook.net/pl_PL/all.js';

    zamieniłem en_US -> pl_PL (polskie locale).
    Chyba o to chodziło?

    I tak jak Michał pisał, FB dostosowuje sam wersję językową w zależności od języka użytego na stronie (w html -> lang="en", lang="pl").

    Pozdrawiam!

    Anonimowy pisze...

    A ja nie wiem skąd pobrać tą aplikację.

    Michal Biniek pisze...

    Aplikacje można utworzyć na https://developers.facebook.com/apps

    Grzegorz Kubala pisze...

    A jakie korzyści mamy po zamieszczeniu takiego buttona logowania na forum??? Wytłumaczy mi ktoś?

    Michal Biniek pisze...

    Można go użyć jako alternatywnego logowania do forum, do autouzupełniania profilu, do połączenia forum z wpisami na FB. Jeśli komuś zależy na takiej integracji to warto umieścić i się z tym pobawić.

    Grzegorz pisze...

    Czy można użyć własnego przycisku lub linku - te standardowe nie zawsze pasują do layoutu strony?

    Michal Biniek pisze...

    Można zastosować okno dialogowe OAuth do zalogowania się do aplikacji - https://developers.facebook.com/docs/reference/dialogs/oauth/

    Polecam też dyskusję na stackoverflow:
    http://facebook.stackoverflow.com/questions/4982220/facebook-login-button-vs-oauth-dialog

    Prześlij komentarz