Tutorial Facebook: Bagaimana nak buat Application Tab

Salah satu komponen Facebook adalah tab. Tab digunakan untuk menyediakan senarai link yang akan digunakan disemua laman (page) bagi memudahkan pelawat melihat dimana mereka berada dalam sesebuah website. Berikut adalah tutorial facebook yang mengajar anda cara untuk membina link dengan menggunakan Facebook Tab untuk aplikasi anda.

Cara penggunaan Facebook Tabs adalah ringkas dengan hanya menggunakan 2 FBML tag:

• fb:tabs
• fb:tab-item

fb:tabs dianggap sebagai "parents" dan digunakan untuk membina tabs itu sendiri manakala fb:tab-item digunakan untuk setiap item yang berada didalam fb:tabs.

Contoh penggunaan

<fb:tabs>
<fb:tab-item href="http://apps.facebook.com/yourapp/index.php" title="Home">
<fb:tab-item href="http://apps.facebook.com/yourapp/friends.php" title="Friends">
<fb:tab-item href="http://apps.facebook.com/yourapp/invite.php" title="Invite Friends"> </fb:tab-item>
</fb:tab-item></fb:tab-item></fb:tabs>


Susunan Tab

Anda boleh memisahkan salah satu senarai item dalam fb:tabs ke sebelah kanan atau kiri. Dalam contoh diatas, kesemua link / item dikumpulkan ke sebelah kiri kerana susunan asal fb:tab-item, jika tidak ditetapkan, adalah sebelah kiri. Untuk menetapkan kedudukan fb:tab-item kebelah kanan, sila beri perhatian kepada sample kod dibawah


<fb:tabs>
<fb:tab-item href="http://apps.facebook.com/yourapp/index.php" title="Home">
<fb:tab-item href="http://apps.facebook.com/yourapp/friends.php" title="Friends" />
<fb:tab-item href="http://apps.facebook.com/yourapp/invite.php" title="Invite Friends" align="right" />
</fb:tabs>

Memapar Tab yang aktif

Kemungkinan besar anda ingin memaparkan kepda pelawat page yang mana satu pelawat sedang berada dengan mengaktifkan fb:tab-item seperti rajah diatas. Item / link yang terpilih adalah 'Home'.

Untuk mengaktifkan item didalam fb:tab adalah berikut

<fb:tabs>
<fb:tab-item href="http://apps.facebook.com/yourapp/index.php" selected="true" title="Home">
<fb:tab-item href="http://apps.facebook.com/yourapp/friends.php" title="Friends" />
<fb:tab-item href="http://apps.facebook.com/yourapp/invite.php" title="Invite Friends" align="right" />
</fb:tabs>

Lanjutkan pembelajaran anda:
http://wiki.developers.facebook.com/index.php/FBML
http://wiki.developers.facebook.com/index.php/Fb:tab-item