Siła Facebook’a tkwi, między innymi, w prostej, estetycznej i jednolitej szacie graficznej. Nie ma tu możliwości wyboru skórek czy graficznego wyróżniania naszej strony. Właściwie wszystkie strony Facebook’a wyglądają niemal tak samo. Istnieje jednak sposób, żeby nasz fanpage odróżniał się nieco od pozostałych. Tym sposobem jest stworzenie indywidualnej strony powitalnej, która wyświetlać się będzie jako domyślna przy pierwszej wizycie na profilu. Prostą stronę powitalną można stworzyć w kilku zaledwie krokach.
Efektem końcowym będzie prosta facebook’owa strona powitalna, taka jak przedstawiona poniżej.
1. Dodajemy do naszej facebook’owej strony aplikację Static FBML, która umożliwia nam dodawanie nowych elementów i ich edycję przy pomocy HTML i FBML. Aby to zrobić klikamy “Edytuj element strona“, następnie na dole strony w okienku “Więcej aplikacji” wybieramy “Przeglądaj dalej”. W okienku wyszukiwania wpisujemy “FBML”, po czym wybieramy z listy aplikację Static FBML. Na stronie aplikacji wybieramy opcję “Dodaj do strony” i wybieramy fanpage, na której chcemy używać narzędzia. Jeśli ktoś jest zupełnie nowy na Facebook‘u, na tym filmiku znajdzie ten proces pokazany krok po kroku.
2. Na naszej liście dostępnych aplikacji pojawi się rzeczony Static FBML. Klikamy opcją “Edytuj” i naszym oczom ukazują się puste pola. Górne oznacza tytuł tworzonej zakładki, drugie wypełniamy FBML.
3. W pierwszej kolejności ustalamy wielkość pola, w którym wyświetli się nasza strona powitalna.
<div style="width: 600px;"> <!-- content --></div> <!-- koniec content -->Jak widać mamy tu do czynienia ze zwykłym HTML, który ustala szerokość strony 600px oraz komentarzem określającym początek i koniec div'a “content”.
4. Pomiędzy div'ami “content” wrzucamy informacje kolorze i rozmiarze nagłówka.
<div style="padding: 10px 0 10px 0; width: 600px;"> <!-- header -->
<h1 style="font-size: 30px; color: #3b5998;">Witaj na naszej stronie!</h1>
</div> <!-- koniec header -->5. Poniżej wrzucamy tekst, który pojawi się w lewej szpalcie naszej strony. Jak widać div ma szerokość 300px i równa do lewej strony. Tekst jest oczywiście przypadkowym zapełniaczem.
<div style="float:left; width: 300px;"> <!-- box_1 -->
<p>Ut leo sem, vestibulum vitae gravida et, gravida nec justo. Nam ante justo, porta nec luctus quis, rutrum nec leo. Curabitur bibendum commodo risus nec luctus. Fusce diam nunc, porttitor quis elementum quis, pellentesque et justo. Integer at velit ut velit blandit pulvinar. In at libero eros, vitae molestie dui. Phasellus vel lacus massa. Duis viverra commodo tempus. Nam a leo in dui luctus egestas. Suspendisse scelerisque dolor ac eros congue cursus. Vestibulum dignissim ligula nec odio interdum in hendrerit magna vehicula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc felis arcu, viverra ut auctor ac, scelerisque in nisl. Sed ut metus metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec sem sem, dapibus ac gravida eu, facilisis aliquam orci. Nulla aliquam vestibulum consequat. Aenean ac risus urna. Nunc lacinia sollicitudin mauris vitae facilisis. </p>
</div> <!-- koniec box_1 -->6. Następny będzie div po prawej stronie, gdzie znajdzie się symulacja facebook’owej tablicy.
<div style="margin-left: 340px;"> <!-- box_2 -->
<h2 style="padding: 10px 0 10px 0;"><a href="http://www.facebook.com/pages/Rajka/109557585728970?v=wall">Przejdź do tablicy</a></h2>
<fb:wall>
<fb:wallpost uid="1">Quisque sollicitudin, felis eget fringilla pretium, odio metus porttitor ipsum, sed aliquam leo sem ut ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</fb:wallpost>
<fb:wallpost uid="1">Quisque sollicitudin, felis eget fringilla pretium, odio metus porttitor ipsum, sed aliquam leo sem ut ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</fb:wallpost>
<fb:wallpost uid="1">Quisque sollicitudin, felis eget fringilla pretium, odio metus porttitor ipsum, sed aliquam leo sem ut ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</fb:wallpost>
</fb:wall>
<div style="float:left; width: 300px;"> <!-- box_1 -->
Elementy FBML wall i wallpost odpowiedzialne są za wyświetlanie elementów tablicy. uid to numer użytkownika lub strony, której miniaturka pojawi się obok tekstu. Tekst musimy dopisać sobie ręcznie. Jak widać, nie jest to więc prawdziwa tablica a jedynie jej statyczna symulacja.
7. Teraz możemy zmienić tytuł boxa na jakiś bardziej ludzki np. “Witaj”.
8. W ustawieniach tablicy (w opcji “Edytuj element strona“) ustawiamy nasz box jako domyślny przy wchodzeniu na stronę (opcja “Domyślna etykieta dla pozostałych użytkowników”).
Nikt oczywiście nie twierdzi, że Twoja strona powitalna ma być równie prosta jak ta przedstawiona powyżej. Może zawierać dodatkowe grafiki, video oraz facebook‘owe elementy języka FBML. Efektem jest jednak zawsze strona która w taki czy inny sposób odróżnia nas od konkurencji.
Podaj dalej:
Bardzo praktyczny artykuł i bardzo ciekawy blog.
Dziękuję bardzo.
Bardzo ciekawy blog
znalazłam na blogboxie (de facto od razu zagłosowałam) i oczywiście trafia do mojego google readera.
Pozdrawiam.
I raz jeszcze dziękuję
[...] Autor: Mateusz [...]
Bardzo dobre opracowanie jak i cały blog zresztą, przyda się
Biter napisał/a ostatnio na blogu: Fr-043: rove / Farbrausch
Nie mogę włączyć FBML na mojej stronie. Jedyna opcja to dodaj do ulubionych. Jak z tym sobie poradzić?
miał ktoś sytuacje w której mimo tego, że utworzyliśmy zakładki FBML, to później w Ustawieniach tablicy nie można było ustawić domyślnych etykiet, po prostu nie ma tego pola wyboru
dość dziwna sprawa, bo już mam zrobioną jedną fanowską stronę i jest możliwość ustawienia a tutaj nie :/
Prawdę mówiąc, nie spotkałem się jeszcze z czymś takim.
sprawa się wyjaśniła z domyślnymi etykietami, szkoda słów, albo 10k fanów albo płacisz by mieć landing page
http://www.allfacebook.com/facebook-limits-landing-tabs-to-authenticated-pages-2010-05
Bardzo pomocne, dziękuję!:)
@mrtom
musisz mieć podłączony profil prywatny pod Twój fanpage.
Bardzo rzeczowy poradnik.
Kamil napisał/a ostatnio na blogu: Binlayer – Zarobki w październiku 2010 r
Hej Kochani mam ten sam problem odnośnie nie widzenia “domyślnych etykiet” i Kasia napisał że musisz mieć podłączony profil prywatny. Tylko jak tego dokonać ? Stworzyłem stronę za pomocą profilu prywatnego jak mniemam oraz dodałem do ulubionych co jeszcze powinienem zrobić?
dzięki za tekst, trzeba się będzie zabrać za przeróbki w takim razie, żeby “nie nudzić” standardem
pozdrawiam
andrzej napisał/a ostatnio na blogu: Pokaz mody Gosi Baczyńskiej
@arySternfeld – dokładnie, mam ten sam problem, kiedy zatem strona będzie mieć domyślne ustawienia? Weszłam na pomoc facebooka, gdzie napisano:
“W jaki sposób mogę zmienić domyślną zakładkę (część mojej strony na Facebooku, do której podczas pierwszej wizyty są domyślnie kierowani użytkownicy, którzy nie wybrali opcji Lubię to w odniesieniu do mojej strony)?
Aby zmienić domyślną zakładkę swojej strony: Po wyświetleniu swojej s…
Aby zmienić domyślną zakładkę swojej strony:
1. Po wyświetleniu swojej strony kliknij link „Edytuj stronę” pod zdjęciem profilowym.
2. Wybierz opcję „Zarządzaj uprawnieniami” z lewego paska bocznego.
3. Zobaczysz opcję „Domyślna zakładka docelowa”. W tym miejscu możesz określić, która zakładka będzie zakładką domyślną Twojej strony. Pamiętaj, żeby zapisać wprowadzone przez siebie zmiany, aby mieć pewność że użytkownicy odwiedzający stronę po raz pierwszy zobaczą to, co chcesz, aby zobaczyli.”
Niestety pkt.3 brak w panelu strony. Czy możesz to wyjaśnić Mateuszu? Albo jeszcze lepiej napisać osobny wpis na temat takich pułapek facebookowych, bo zastanawiam się, co mnie jeszcze może zaskoczyć ze strony fb.
Pozdrawiam.
Witam wpisałem strukturę:
kod css
kod html
pod ff etc jest ok niestety ie wcale nie czyta tego css można jakoś to obejść by nie pisać dla każdego elementu “style=”
a jeśli się nie da, jak zrobić podkreślenie na linku jako a:hover w kodzie html?
Niestety static fbml już nie działa. Facebook wycofał się z możliowści używania tego rozwiązania. Zapraszam na moją strone gdzie jest video w jaki sposób można zrobić teraz zakładkę na fanpage.
Jak zrobić zakładkę powitalną na fanpage?
To może warto byłoby tutaj zaktualizować informacje o zakładce na fanpage
świetny artykuł, bardzo paktyczne porady, które może wykorzystać osoba tworząca takie strony dla firm czy instytucji publicznych
Bardzo dobre opracowanie !
Ostatnio zastanawiałem się co zrobić aby facebook był ciekawszy, a nie taki nijaki jak go dotąd widziałem. Był na tyle nudny, że bywałem na nim raz na miesiąc.
I …
, hehe. wszedłem tam wczoraj i u znajomego zauważyłem oś czasu. Po zainstalowaniu zrobiło się ciekawiej.
Nie będę reklamował swojego f, więc nie podam bezpośredniego linku. Pomogę tym, którzy się zwrócą o to
pozdrawiam