Dziś opiszę wam krok po kroku, jak wykonać indywidualną, specjalną stronę startową (landing page) na profilu dla fanów (fanpage) na Facebooku. Jest to strona, którą użytkownicy Facebooka, którzy nie należą jeszcze do grona naszych fanów, zobaczą jako pierwszą po wejściu na nasz profil. Do wykonania tej strony wykorzystamy tzw. Statyczny FBML (Static FBML).
Co to jest Statyczny FBML?
Statyczny FBML (Static Facebook Markup Language) to aplikacja, dzięki której możemy do naszej strony fanowskiej na Facebooku dodawać indywidualne, spersonalizowane zakładki z różną ich zawartością. Dzięki Statycznemu FBML możemy stworzyć zakładkę, na przykład z filmami z YouTube, czy galerią zdjęć z serwisu Flickr. W tym wpisie pokażę jak wykonać prostą stronę powitalną dla gości naszej strony.
Strona startowa krok po kroku
Całą zabawę zaczynamy jednak nie od Facebooka, a od przygotowania w programie graficznym ilustracji, którą zamieścimy na naszej stronie powitalnej. Przy tworzeniu tej grafiki należy pamiętać o dwóch sprawach:
- szerokość grafiki powinna mieścić się w granicach 800 pikseli, aby zmieściła się w kolumnie
- najlepiej zapisać ją jako GIF, żeby dość szybko się wczytywała
Przygotowaną grafikę (zobacz moją) przenosimy na nasz serwer i zapamiętujemy do niej link. Tak przygotowani przechodzimy na naszą stronę dla fanów i działamy w następujący sposób:
Wchodzimy na stronę aplikacji i klikamy w link “Dodaj do mojej strony” znajdujący się bezpośrednio pod ilustracją aplikacji po lewej stronie ekranu. Z listy, która się pokaże wybieramy stronę, na której chcemy zamieścić naszą specjalną zakładkę.
Klikamy "Dodaj do mojej strony"
Następnie klikamy w link “Edytuj element Strona” znajdujący się bezpośrednio pod ilustracją naszego profilu,
Klikamy w link "Edytuj element Strona"
a następnie, na liście elementów odszukujemy pozycję FBML-FBML i klikamy w link “Ustawienia aplikacji” i zatwierdzamy dodanie zakładki klikając w przycisk “Okay”.
Klikamy w link "Ustawienia aplikacji"
Teraz w tej samej pozycji FBML-FBML klikamy w link “Eytuj”. W oknie, które nam się pokaże wpisujemy:
- w pozycji “Tytuł boxa” tytuł zakładki, która pokaże się na naszej stronie profilowej
- w pozycji “FBML” wpisujemy kod HTML, dzięki któremu wyświetli się nam przygotowana wcześniej ilustracja
Następnie klikamy w przycisk “Zapisz zmiany”.
Edycja zakładki FBML
Ostatnia rzecz jaką musimy zrobić to klikamy ponownie w link “Edytuj element Strona” a następnie link “Edytuj” w pozycji “Ustawienia tablicy”. Z rozwijanej listy zatytułowanej “Domyślna etykieta dla pozostałych użytkowników” wybieramy zakładkę, którą właśnie skończyliśmy przygotowywać.
Ustawienia tablicy na stronie dla fanów
Efekt naszej pracy jest następujący: jeśli ktoś, kto nie należy jeszcze do grona naszych fanów wejdzie na nasz profil, zostanie automatycznie skierowany na stronę z zakładką, którą właśnie stworzyliśmy (zobacz moją), natomiast wszyscy nasi fani jako pierwszą zobaczą stronę z zakładką “Tablica”.
Inne możliwości
Jak wspomniałem na początku artykułu dzięki statycznemu FBML możemy stworzyć zakładki, które mogą mieć różną zawartość. Polecam Wam wpis na blogu Hyper Arts, w którym znajdziecie mnóstwo linków do tutoriali wyjaśniających, jak to zrobić.
Podsumowanie
Mam nadzieję, że wpis Wam się spodobał i skorzystacie z niego, aby stworzyć ciekawe strony startowe dla Waszych profili na Facebooku. Chętnie zobaczę Wasze gotowe dzieła :) Jeśli znajdziecie jakieś oryginalne pomysły u innych, podzielcie się linkami w komentarzach.
[Aktualizacja] Jak podlinkować obrazek?
Bardzo dużo osób pyta w komentarzach, jak podlinkować obrazek, żeby przekierowywał na jakąś stronę. Rozwiązanie jest bardzo proste. W odpowiednim miejscu całości kodu trzeba wpisać coś takiego:
Przykładowy link do obrazka
Oczywiście to co podałem to jest przykład i w pierwszym cudzysłowie trzeba podać pełen adres strony, do której ma przenosić użytkownika kliknięcie na obrazek, natomiast w drugim cudzysłowie trzeba wpisać pełny adres internetowy, pod którym znajduje się obrazek będący linkiem.
No proszę, nie wiedziałem, że jest taka opcja. Niedawno wystartowałem z fan page'm więc na pewno bardzo się to przyda. Dzięki! Na pewno się pochwalę jak coś wykombinuję.
Ja to też odkryłem dopiero wczoraj przez przypadek szukając czegoś innego w sieci. Cieszę się, że wpis się podoba i czekam na efekty :)
Panie Piotrze może coś dla profili personalnych, bo fmbl jest jedynie dal stron fanowskich ;)
U mnie niby wszystko ok, rozmiar już nawet do 150kb, 546×1200, gif, a ciągle tylko znacznik tekst z title się pokazuje, dlaczego nie wczytuje obrazka, mimo, że jest na serwerze wszystko ok i kod html też wpisany poprawnie…?
Panie Piotrze!
Wielkie dzięki za szczegółową instrukcję. Brawo, nie sądziłam, że kiedykolwiek uda się komuś wytłumaczyć mi programowanie. Fakt że dużo tu nie było, ale jak na takiego laika jak ja, to i tak jestem dumna :) A z takimi wytycznymi, to aż przyjemność :) Proszę o więcej ciekawych pomysłów na urozmaicenie strony na Facebooku. Oto rezultat mojej pracy:
http://www.facebook.com/pages/FireFlower/20270747…
Przy okazji zapraszam do zapoznania się z naszą twórczością.
Pozdrawiam,
Justyna
Dzięki za miłe słowa :) Obejrzałem dzieło – fajne zdjęcie, ma klimat :)
Kurczę, zrobiłam wszystko, jak napisałeś, a nie wyświetla mi się rozwijana listy zatytułowana “Domyślna etykieta dla pozostałych użytkowników”. W sensie nie mam tego w ustawieniach tablicy mojej strony :(
Wiesz może, co może być nie tak?
Przed chwilą sprawdziłem i u mnie taka opcja się wyświetla więc nie wiem w czym może być problem.
Mam ten sam problem, nie wyświetla się opcja "Domyślna etykieta dla pozostałych użytkowników"
Nie wiem od czego do zależy.. ale nie ma
Ogromne dzięki za tą instrukcję! Efekty już widać na stronie http://www.facebook.com/pages/Warszawa-Poland/JRG… a to dopiero początek, bedzie jeszcze lepiej!
U mnie niestety na mojej fanpage nie pojawia się link przy FBML "dodaj do mojej strony", a jedynie link "Dodaj do ulubionych". Czy powinnam coś przestawić w ogólnych ustawieniach??
ok, już wiem. Napiszcie powyżej, że trzeba mieć profil prywatny podłączony do fanpage, jako administratora.
Ja jakoś ominęłam ten etap i nie miałam możliwości dodawać zakładem FBML.
Piotrze artykuł bardzo pomocny, zrobiłam stronę powitalną, ale mam problem, być może banalny, choć ja akurat, jako początkująca nie potrafię sobie z nim poradzić. Jak zrobić aby przekierowanie z boxu FB na blogu było do tej strony powitalnej?? Próbowałam w kodzie zmienić adres docelowy, niestety dalej wchodzi na tablicę. Pewnie rozwiązanie jest banalne, tylko ja go nie znajduję i bardzo proszę o pomoc. :)
Pozdrawiam
Żeby trafić na stronę powitalną, a nie od razu na tablicę, jako jej administrator musisz być wylogowana z Facebooka. Poza tym, wszyscy Ci, którzy nie są jeszcze fanami naszej strony również zostaną przekierowani na stronę powitalną, a nie do treści opublikowanych na tablicy.
Proszę bardzo, mam nadzieję, że działa jak należy :)
Wypasiony tutorial i cały blog.
Wielkie dzieki ja skorzystałem oto efekty:
http://www.facebook.com/home.php?#!/pages/Toposfe…
jak wstawić obrazek z linkiem do strony? Prosze o pomoc
Bez bliższych szczegółów trudno mi powiedzieć dlaczego, ale przypomnę, że aby móc taką stronę tytułową stworzyć, należy najpierw założyć fanpage, a to z kolei wiąże się z założeniem najpierw własnego, prywatnego konta na FB.
Piotrze – mam i stronę i fanpage i mam już zakładkę nawet – problem polega na tym że w zakładce nie wyświetla mi się zdjęcie. Mimo, że robię wszystko w htmlu – zdjęcie mam wrzucone na serwer to po dodani u na stronie FC jest pusto i zdjęcia nie widać. Wiesz może dlaczego ? Będę wdzięczna za pomoc
Być może będę mógł więcej pomóc jeśli zobaczę kod jaki wkleiłaś, więc prosiłbym, żebyś przesłała mi na maila plik tekstowy z tym kodem. Może tam wkradł się jakiś błąd. W treści maila podaj mi też pełen adres internetowy do ilustracji, która ma być wyświetlana na stronie.
Wydaje mi się, że taka forma komunikacji z Fanami nie jest możliwa. Można to robić tylko przy pomocy postów i komentarzy na Tablicy, pozwalając pisać Fanom na niej własne posty, nie tylko swoje, firmowe.
Ja podlinkować taki landing page aby klikając na niego przekierowywał do konkretnej strony?
musiałbyś użyć edytora graficzneg np photoshopa i urzyć narzędzia do dzielenia obrazka tak by każda jego część stanowilła jakąś osobną część w HTML'u dzięki czemu łatwo podlinkujesz, narzędzie w photoshopie do tego nazywa się "slicetool"
Super poradnik bezproblemowo założyłem stronę powitalną ;)
Natomiast mam inny problem , posiadam fan page mojej strony internetowej, już jest tam kilku fanów i problem tkwi w tym że gdy pisze coś na fan page'u to niestety fani nie widzą tych komunikatów na swojej tablicy aktualności…próbowałem już porad zawartych w centrum pomocy FB (dokładnie jednej jaką znalazłem) niestety nic to nie pomoglo.
Czy ktoś może wie na czym polega problem ?? będę wdzięczny za jakąkolwiek pomoc i wskazówki :)
mail: sebastian.tuszynski@gmail.com
Trzeba sprecyzować pytanie: czy postów, które publikujesz na fanpage'u nie widzą u siebie na tablicy osoby, które należą do jej fanów, czy wszyscy użytkownicy Facebooka?
postów nie widzą u siebie na tablicy osoby które już należą do fanów.
a żeby się wyświetlały to trzeba i tak dołączyć ;)
Ja wiem, że powinno tak być, ale dlaczego tak się nie dzieje, niestety ja nie mam pojęcia. Dobrze, że opisałeś tu problem, może ktoś Ci go pomoże rozwiązać :)
oby :)
Witam. Prawie mi sie udalo. Mimo, ze w ustawieniach tablicy wybralem interesujaca mnie zakladke, nie wyswietla sie ona. Dlapoczemu ?:)
U mnie Pana strona powitalna wyświetla się jak trzeba;)
Moze jak sie lubilo, a przestalo to sie nie pokazuje :) Dziekuje ;)
Witam:))
Dziękuje bardzo za tutoriala dzięki niemu powstała zakładka powitalna widoczna tutaj: http://www.facebook.com/OnaOnStudio
Mam jednak pytanie czy można i w jaki sposób dodać kolejną aplikację Static FBML do tej samej strony fanowskiej? Pytam gdyż chciałam umieścić na niej formularz kontaktowy:) Jeśli sie uda to chętnie podzielę się jak to zrobiłam.
Pozdrawiam:)
Magda
Na spodzie przy edycji aplikacji jest link do dodania kolejnej :)
Dzięki:) Już sobie poradziłam znalazłam tutoriala na YT:)
Dzięki! Skorzystałem z tutoriala :) Tutaj efekty :
http://www.facebook.com/pages/LEGO/17249599943271…
Zapraszam kliknij "Lubię to!" :)
http://www.facebook.com/fotoszop tutaj moje efekty ;)
Zapraszam http://www.facebook.pl/ochronasrodowiska
dzięki wielkie, wszystko działa sprawnie :) oto efekt: http://www.facebook.com/pages/King-Road/194440336…
Pozdrawiam.
Dobrze jest też zmienić linka i ustawić sobie nazwę użytkownika. Robi się to tutaj: http://www.facebook.com/username/ i efekt taki: http://www.facebook.com/LegoMarket
powiedz mi czy musiałeś "zweryfikować konto"? jeśli tak to jak to zrobiłes.
Proszę o odpowiedz
W momencie, kiedy robiłem ten tutorial nie potrzebna była żadna weryfikacja konta przy tworzeniu tej specjalnej zakładki, więc Ci nie odpowiem na to pytanie, jak jest teraz.
Mam otóż taki problem, nie mogę znaleźć u siebie tego ostatniego punktu, czyli Ustawień tablicy – nie mam czegoś takiego.
Witam,
Ja mam problem dotyczacy nie tyle tworzenie, a funkcjonowania strony na FB.
Po utworzeniu wlasnej strony http://www.facebook.com/xxx nie zawsze sie ona wyswietla i czasami pojawia sie komunikat: Nie znaleziono żądanej strony.
Być może kliknięto nieważny link lub źle wprowadzono adres. W niektórych adresach internetowych rozróżniane są wielkie i małe litery.
Raz dziala, a za chwile nie. Nigdzie nie moge znalezc odpowiedzi co moze byc przyczyny
Blagam o pomoc!!!
Dziekuje i pozdrawiam
Witam!
Ślicznie dziękuję za wszystkie rady w powyższym tekście :) Na podstawie wskazówek udało mi się już stworzyć coś takiego: http://www.facebook.com/reszort
I muszę przyznać, że jak na pierwszą próbę – jestem zadowolony :)
Dziękuję i pozdrawiam
witam, próbowałem username ustawić i FB poprosił o numer tel na który miał mi wysłać jakiś kod, podałem numer ale nie dostałem kodu. Niestety nie da się powtórzyć tej operacji. Zna ktoś jakieś rozwiązanie takiego problemu? Będę bardzo wdzięczny. Pozdrawiam.
mam problem bo robie wszystko zgodnie z instrukcja i zatrzymuje się na etapie dodania do mojej listy zakładek ale niestety brakuje mi opcji "Edytuj"- co poradzić czy to mój błąd czy o co chodzi
Dzięki za pomoc. Świetny artykuł, który pomógł mi rozbudować funkcjonalność FC.
Gdzie musi być umieszczony baner aby poprawnie wyświetlał się na stronie powitalnej? Niby wszystko wpisałam i w ogóle, ale nie widać obrazka tylko tytuł ;/ (chyba, że coś poknociłam;/) Proszę o podpowiedź jaki kod HTML powinien by wpisany kiedy obrazek jest na pulpicie lub na facebooku…
Plik z grafiką musisz wrzucić gdzieś na serwer w sieci, ponieważ w treść kodu musisz wpisać adres internetowy tego pliku.
Dzięki. Działa :) http://www.facebook.com/fotografslub
witajcie, a jakie rozmiary powinien mieć plik do wstawienia w fbml?
Na dzień dzisiejszy obrazek nie powinien być szerszy niż 500 pikseli. Tak mam u siebie i wszystko się mieści.
Super artykuł! Bardzo mi pomógł :) pozdrawiam!
http://www.facebook.pl/agencjafoto :) To moj landing Page :)
Fajny pomysł z wideo, podoba mi się :)
Świetny poradnik!
U mnie wygląda to tak : http://www.facebook.com/ITLifePL
Dzięki za dobry artykuł!
A co zrobić, żeby zakładki wyświetlały się u góry strony, a nie pod zdjęciem profilowym?
Tak to wygląda u mnie :( http://www.facebook.com/pages/Paweł-R-Stań/1271…
pozdrawiam :-)
Facebook wprowadził ostatnio kilka zmian w wyglądzie i administrowaniu stronami. Jedną z tych zmian jest przeniesienie zakładek pod ilustrację profilową i tego już nie można zmienić.
Witam i dziękuję za ciekawą stronę. Miło by było gdyby Pan ją zaktualizował. Co się namęczyłem żeby w nowych ustawieniach facebook'a znaleźć to co Pan tłumaczy to moje. Ale i tak pomógł Pan. A przyznam się że to były moje pierwsze godziny z facebookiem.
Witam
Czy orientuje się Pan jak stworzyć stronę startową podlinkowaną?;>
Zależałoby mi na czymś podobnym do fan-pagu
http://www.facebook.com/RenaultPL
Byłbym wdzięczny za pomoc i wskazówki:-)
Pozdrawiam serdecznie:D
Sam tego nie próbowałem, ale przypuszczam, że wystarczy zastosować taką samą metodę linkowania obrazków jak w HTML.
hej,
mam pytanie, bo opisujesz to dosc pobierznie jak dla mnie. grafike stworzyc stworzylam ale jak dodac opcje zeby konkretne ikony po kliknieciu odsylaly na konkretne strony? Jakiego powinnam uzyc programu do tworzenia takiej grafiki?
Na końcu artykułu opublikowałem aktualizację, w której podałem metodę na wstawienie obrazka będącego odnośnikiem do konkretnej strony.
Piotrze Dzięki serdecznie za bardzo cenną pomoc :)
Aktualnie buduję profil na FB dla firmy i strona startowa będzie jak znalazł :D
p.s Jestem już fanką twojego bloga ;)
Witam serdecznie,
dziękuję za jasne i przejrzyste wskazówki :) Udało mi się dodać aplikację z grafiką, a nawet ją podlinkować.
Mam jednak mały kłopot:
“Prowadzę” na FB fanpage dwóch małych firm. Na jednej z nich udało mi się ustawić panel powitalny i działa jak należy, czyli mamy sukces: http://www.facebook.com/pages/Union-Jack-Szkoła-Języka-Angielskiego/193325280690400
ale na drugiej fanpage nie mogę zmienić ustawień tak, by strona powitalna pojawiała się jako pierwsza – goście od razu widzą tablicę: http://www.facebook.com/pages/YOKA-Automotive/177848482247011
Próbowałam porównać ustawienia obu stron i nie mogę znaleźć miejsca, gdzie tkwi błąd. W edycji strony YOKA nie pokazuje mi się w ogóle opcja zmiany “domyślnej zakładki”…
Pięknie proszę o pomoc i serdecznie pozdrawiam!
Witam
Panie Piotrze, ze zdjęcim to fajna sprawa ale chciałbym wstawić zdęcie w ten sposób żdby tekst był z boku – w tej chwili zdjęcie jest nad tekstem albo pod tekstem nigdy z boku, a może ktoś wie jak to zeobić.
Pozdrawiam
Mam pytanie.. Jak dodać na facebooka zdjęcia gif? podczas dodawania właśnie zdjęć gif automatycznie zmienił się format na jpg, zdjęcia gif są animowane więc straciły swoje właściwości po dodaniu ich na facebooka. Co zrobić żeby nie zmieniał się format gif?
Z góry dzięki..
U mnie tez juz zrobione i ciszy sie duzym zainteresowaniem fanow. Jednak mam mieszane uczucia aby pozostawic tablicejako moja startowa strone.
bardzo pomocny wpis! dzięki
Fajnie to wytłumaczyłeś, od razy zrobiłem coś takiego u siebie, http://www.facebook.com/pages/manage/#!/pages/TwojBiznesOnlinepl/191476320889130?sk=app_4949752878
a nawet wstawiłem formularz.
Dziękuję!
Świetny poradnik, szkoda, że FB zlikwidował FBML, tym ruchem odsuwa się coraz bardziej od MySpace, które pozwala na kustomizację właściwie wszystkiego przez kreatory bez linijki kodu. No ale cóż… są na szczęście już kreatory. Zrobilem ich zestawienie: http://www.slideshare.net/tomaszsmykowski/jak-doda-zakadk-do-fanpage-bez-fbml
Dzięki za linka, na pewno się przyda :)
Na mojej stronie znajdziecie także video z nagraniem jak to po kolei zrobić za pomocą nowej aplikacji.
Jak zrobić zakładkę powitalną na fanpage?