Cara Membuat Facebook Fan Box

Perlukah membuat Facebook Fan Box pada Blog?, Seberapa pentingkah Facebook Fan Box?, Kapan waktu yang tepat untuk menempatkan Facbook Fan Box pada blog anda?

Jawabannya tentu sangat relatif dan tergantung kebutukan dan keputusan blogger itu sendiri, namun sebagai referensi untuk menjawab pertanyaan-pertanyaan itu, anda bisa membacanya pada Diptara Blog mengenai "Mengapa Perlu membuat Fan Page Blog".

Pada kesempatan ini saya tidak akan membahas mengenai fungsi dan manfaat dari Facebook Fan Box secara detail, tetapi saya hanya akan menjelaskan bagaimana cara membuatnya.

Yang perlu diketahui sebelum membuat Facebook Fan Box pada Blog :

1. Harus memiliki blog atau website dengan fasilitas Customize atau Edit HTML/ Java Script seperti blog yang dibuat menggunakan Blogspot, Wordpress, Joomla, dll.
2. Create Page atau buat page baru dengan nama yang sesuai dan posisi anda harus sebagai creator atau admin.
   
   
   
   
   
   
3. Anda akan dibawa ke halaman Create New Facebook Page. Isilah dengan data-data yang diperluakan, beri nama page anda sesuai dengan nama blog, kemudian click "Create Page". Anda bisa mem-publishnya sekarang atau nanti dengan menchecklist option di bawah nama page yang telah anda tulis.
   
   
   
   
   
   
4. Page telah berhasil dibuat. Pada halaman ini anda bisa mengupload foto, setting, atau melakukan pengeditan.
   
   
   
   
   
   
5. Sampai saat ini Facebook Page telah berhasil dibuat. Tutup halaman ini tetapi jangan dulu logout dari Facebook.
6. Ikuti langkah-2 membuat Facebook Fan Box di bawah ini.

Cara membuat Facebook Fan Box :

1. Login pada Facebook dengan username dan Password anda. (langkah ini bisa dilewat jika anda belum logout dari Facebook)
2. Buka Facebook Widget lalu pilih Fan Box
   
   
   
   
   
   
3. Langkah kedua juga bisa dilewat dan langsung saja masuk halaman Fan Box Widget
4. Pilih nama Page yang barusan telah anda buat, checklist option dibawahnya sesuai keperluan dan keinginan anda. Tampilan Fan Box akan terlihat di sebelah kanan. Pilih Blogger atau Other untuk menempatkan kode Fan Box Facebook yang nantinya akan ditempatkan pada blog anda. Salin kode tersebut dan sisipkan HTML pada blog anda.
   
   
   
   
   
   
5. Tanda merah Publish This Page adalah informasi bahwa page ini belum dipublish. Click untuk mempublishnya. Kode keseluruhannya akan seperti di bawah ini :
   
   <script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script><script type="text/javascript">FB.init("1c47bb805944898d387d1e227156e390");</script><fb:fan profile_id="314269581346" stream="0" connections="10" logobar="1" width="300"></fb:fan><div style="font-size:8px; padding-left:10px"> <a href="http://www.facebook.com/pages/Link-Sukses/314269581346">Link Sukses</a> on Facebook</div>
   
6. Perhatikan kode di atas, profile_id, stream, connections, logobar, dan width. Kode tersebut akan menjadi acuan dan dapat dirubah sesuai kebutuhan.

Customize Facebook Fan Box:
Untuk melakukan customize Fan Box tersebut, yang harus diperhatikan adalah profile_id yang telah diberikan (lihat kode di atas, profile_id="3142691346"). Kode ini sebagi identitas Fan Box yang bersangkutan.

1. Stream ="1" untuk menampilkan stream pada Fan Box, Stream="0" untuk menyembunyikan stream.
2. Connections : Uuntuk menampilkan jumlah fan (maksimal 100), misalnya connection="20" akan menampilkan 20 fans pada Facebook Fan Box tersebut.
3. Logobar="1" untuk memapilkan logo Facebook pada Fan Box, logobar="0" untuk menyembunyikan logo Facebook pada Fan Box.
4. Width : Untuk mengatur lebar Fan Box pada blog dalam pixel (px).
5. Height : Untuk mengatur tinggi Fan Box dalam pixel (px). maksimal 554 pixel.
6. ...php/en_US": en_USbisa diganti dengan kode bahasa yang akan digunakan poda Facebook Fan Box contoh en_US (English United State), en_GB (English United Kingdom), id-ID (Bahasa Indonesia), dall lebih lengkapnya bisa dilihat pada Facebook Locales.

Membuat Facebook Fan Box dengan IFrame
Pada suatu saat mungkin anda akan membutuhkan scrolling pada facebook Fan Box karena jumlah Fans yang sudah banyak atau untuk menghemat tempat pada blog. Acuan pembuatan Fan Box ini adalah sama yanitu kode-kode yang diberikan sebelumnya yaitu profile_id, stream, logobar, dll. Perhatikan contoh di bawah ini :

<iframe scrolling="no" frameborder="0" src="http://www.facebook.com/connect/connect.php?id=YOUR_PAGE_ID&connections=10&stream=1&css=PATH_TO_STYLE_SHEET&locale=your_LOCALE" allowtransparency="true" style="border: none; width: 300px; height: 550px;"></iframe><div style="font-size:8px; padding-left:10px"> <a href="URL_TO_YOUR_PAGE">PAGE_NAME</a> on Facebook</div>

• Scrolling : Untuk menampilkan atau menghilangkan scrollbar ("yes" dan "no")
• Frameborder : Untuk mengatur ketebalan border frame atau garis pinggir dalam pixel
• YOUR_PAGE_ID : Ganti dengan profile_id Fan Box anda.
• Connections=10 : Ganti angka 10 dengan jumlah Fans yang akan anda tampilkan pada Facebook Fan Box (maksimal 100)
• PATH_TO_STYLE_SHEET : Ganti dengan path style Fan Box anda yang telah diberikan di atas.
• your_LOCALE" : Ganti dengan kode bahasa yang akan ditampilkan pada Fan Box.
• Width:300px : Ganti nilai 300 dengan lebar Fan Box yang anda inginkan (dalam pixel)
• Height:550 : Gganti 550 dengan tinggi Fan Box yang anda inginkan (maksimal 554px)
• UR_TO_YOUR_PAGE : Ganti dengan URL Facebook Fan Box anda.
• PAGE_NAME : Ganti dengan nama page anda.
• Font-Size:8px : Ganti nilai 8 dengan ukuran font yang anda inginkan.
• Setelah selesai, periksa kembali dan samakan kode dan nilai yang diganti tadi dengan kode pada saat pembuatan Page di kotak paling atas (kode acuan).
• Copy semua kode tersebut kemudian sisipkan pada HTML blog anda.
• Contoh Facebook Fan Box :
  
  
  
  
  
  
• Selesai, Semoga bermanfaat.

Mohon maaf, cara ini sudah tidak berlaku lagi karena kini fitur-fitur Facebook sudah diubah.