Home » , , » Modifikasi Tampilan Facebook Like Box dengan CSS

Modifikasi Tampilan Facebook Like Box dengan CSS

Written By Aa Sholah on Sabtu, 07 Juli 2012 | 10.17

Modifikasi Tampilan Facebook Like Box dengan CSS
Facebook merupakan salah satu Situs Jejaring Sosial terbesar saat ini, Tak aneh jika Facebook menyediakan beragam widget Facebook untuk Blog/Website salah satunya adalah Like Box Fans Page Facebook, meskipun Fans Page Facebook tidak mutlak di khususkan untuk Blog/Website, namun jika suatu Blog/Website memiliki FansPage Facebook dapat juga dijadikan sarana untuk promosi dan meningkatkan traffik Blog kita..
Kali ini saya akan sedikit berbagi bagaimana Modifikasi Tampilan Facebook Like Box dengan CSS karena mungkin sobat semua sudah bosan dengan tampilan Like Box Fans Page yang biasa-biasa saja. Oke langsung saja silahkan sobat lihat Demonya berikut ini :



Gimana apkah sobat tertarik dengan tampilan Tampilan Facebook Like Box yang sudah dimodifikasi ini? jika tertarik silahkan ikuti CaraGampang berikut :
Perhatikan kode berikut
<script src='http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US' type='text/javascript'/>
<script type='text/javascript'>FB.init(&quot;&quot;);</script>
<fb:fan connections='10' css='http://caragampangcom.googlecode.com/files/FB.css' header='0' height='200px' logobar='0' profile_id='175220759192447' stream='0' width='300px'/>
Silahkan pasang kode di atas sesuai kehendak sobat di Blog masing-masing..
Keterangan : silahkan di ganti kode berikut
  • Angka 10 : menunjukan jumlah thumbnail yang tampil.. 
  • 200 dan 300 : menunjukan tinggi dan lebar
  • Tulisan Merah : itu kode CSS-nya jika sobat bisa mengedit silahkan di edit, jika tidak bisa, gunakan saja CSS milik saya itu.
  • 175220759192447 : itu adalah ID Fans Page Facebook saya , silahkan diganti dengan ID Fans Page Facebook milik sobat masing-masing..
Contoh ID Fans Page facebook : 
http://www.facebook.com/CaraGampangCom/175220759192447
angka yang di akhir adalah ID Fans Page Facebook..
Mungkin cukup itu saja, jika ada yang tidak dimengerti silahkan berkomentar di bawah ini, selamat mencoba Memodifikasi Tampilan Facebook Like Box dengan CSS.

AUTHOR CARAGAMPANG.COM

author-photo
Writen by Aa Sholah
Cuma seseorang yang ingin berbagi menggunakan media blog.

"Hidup cuma sekali, jangan bikin ga berarti"

:: Follow Me ::

Share :

38 komentar:

  1. thx tips2x sob.., btw fb like box itu membuat blog terasa berat.., mgkn terasa ringan klo dimasukkan sj ke dlm postingan..,

    happy blogging.. *smile

    BalasHapus
  2. hallo mas, saya mau nanya nih, buat banner buat nya pake software apa ya? dan upload nya gmna caranya ya mas? tolong bantu donk mas.... bales di blog saya ya/

    BalasHapus
  3. @Rohis Facebook yuppss,, betul banget bro makanya saya masukinnya ke dalam Postingan.. :) hehe

    BalasHapus
  4. @zondim Saya kalo ngolah Gambar suka pake PHOTOSOP CS-3 , baik Banner ataupun yang lainnya..
    Untuk cara Upload sama saja seperti upload gambar pada postingan Blog ,, tapi tidak di terbitkan biarkan menjadi Draf...

    BalasHapus
  5. dapat pengetahuan baru deh hehe :D

    BalasHapus
  6. nice info nya sob... bisa di praktekan nih

    BalasHapus
  7. gan,,saya izin minta template nya boleh gak,,!!
    persis seperti blog ini..soalnya bagus banget,,!!
    di kasih ya gan,,, plisss..

    thanks,,
    >> javakahuripan@gmail.com

    BalasHapus
  8. mantap nih.. :D

    saya bikin page dulu kalo begitu.. :D

    BalasHapus
  9. Maknyus... manteb Triinya Mas Bro... :D
    Ijin aplikasiiin triknya,,, Thanks
    Hadir perdana di mari, bawa oleh2 MP3 Kisah Inspiratif Bag. XV, reviewnya ditunggu Sob... Thanks,

    BalasHapus
  10. @Admin ./Boriel Cyber == Silahkan di praktekin gan :d Happy Blogging...

    BalasHapus
  11. @Nur Kholis hehehe.., insyaalloh deh kapan-kapan saya bagikan, kebetulan ada beberapa orang juga yang minta..

    BalasHapus
  12. @affanibnu Silahkan bro bikin dulu Fans Pagenya :d happy Blogging

    BalasHapus
  13. @SANG PEMBELAJAR Silahkan di aplikasikan mas ,, terimakasih sudah berkunjung :) saya segera meluncur kesana :d

    BalasHapus
  14. @Rulita.park hehe.. makasih yaa sudah berkunjung ke sini :d

    BalasHapus
  15. Asslm. Pha kabar nich? Tutorial yang menarik. Aku tadi ngunjungin Maskolis, disitu aku liat aa Solah bikinin banner yang bagus2 buat Maskolis. Aku mau dong dibikinin. Hehehe maklum aku ga tau pake photoshop. Aku pengen Tittle 1001 Ebook diganti pake Gambar, terus aku pengen ada Banner 1001 ebook di fotter yang panjangnya selebar footer. Gambarnya disesuain aja dengan Blognya. Bisa ga aa Solah bikinin? Kalo sempet aja. Makasih ya sebelumnya.

    BalasHapus
  16. @Faiz Naufal Wa'alaikumslm.. Alhamdulilah kabar rruarbiasa sehat..hehe
    Insyaallah saya bisa buatkan ,, tapi saya bingung ukuran gambarnya berapa Pixel ya.. hehe nanti kalo saya asal bikin takut kegedean takut kekesian...

    BalasHapus
  17. ternyata bisa juga dimodifikasi ya

    BalasHapus
  18. ajib..infonya sangat menarik kawan

    BalasHapus
  19. gimana cara pasang facebook fan page di sebelah 'related article' di atas ya? terima kasih

    BalasHapus
  20. trik yang mantab
    mampir juga yuk kesini :)

    BalasHapus
  21. Info bagus gan..Terima kasih tipsnya. Ditunggu kunjungan baliknya..

    BalasHapus
  22. bagus sob... tapi saya gag punya fanspage..heheh

    BalasHapus
  23. aa sholah,,, saya ijin pake template dari caragampang.com yang di sahre sama mas kolis,, saya mau tanya tentang fanspage itu di pasangnya dimana ya,, saya cari di edit html ko ga ada ya,, saya mau ganti fans pagenya tapi ga ketemu-ketemu,, apa di widget ya

    BalasHapus
  24. krim email ya aa solah...dhel.agy@gmail.com..

    BalasHapus
  25. wah keren euy tampilan facebook likenya :D

    BalasHapus
  26. @Kang_adesilahkan mas tinggal dipake templatenya..
    untuk memasang FansPagenya gak usah ribet-ribet tingal cari angka ini 175220759192447 di Edit HTML (jangan lupa di klik Expand Template Widget) terus ganti dengan ID FansPage milik agan..

    BalasHapus
  27. Mas, bole gak minta kode Auto like facebook? mohon pencerahan-a ya mas ( email taufikalief@yahoo.co.id )

    BalasHapus
  28. @Taufikcoba di googling bang taufik , saya rasa sudah bnyak.. :)

    BalasHapus
  29. Mas, bisa kirim ke email kode auto like-a ? mohon bantuan-a ya .saya sudah coba tapi malah berkurang LIKE-a.

    Mohon Pencerahan-a yoo Mas

    BalasHapus
  30. Mas sudah 1 bulan lebih saya nunggu kode ke email tapi kok gak masuk2 ya. apakah saya tidak dapat pencerahan dari mas bro solah ?

    BalasHapus
  31. Bagus tampilannya, ada modifikasi lain lagi tdk?

    BalasHapus
  32. Mas broo, kasih pencerahan sikit donk, auto like js-a kok mengunlike pada kunjungan ke-2.

    BalasHapus
  33. Tampilannya jadi lebih simpel yah gan :)
    Manteb deh, apa-apa kalo dipadu ama CSS hasilnya indah sepertinya.
    Hehehe

    BalasHapus
  34. keren gan,, cuma aku belum buat fans grup seperti kebanyakan blogger aja

    BalasHapus
  35. ini blog pelit, nggak bisa copas.

    BalasHapus
  36. Blogwalking sobat. Blognya makin cakep aja, hehe :D Makasih tipsnya ya sob, nanti atau kapan saya akan praktikkan tipsnya di atas :)

    BalasHapus
  37. thanks infonya sob . .
    izin coba , ,

    BalasHapus

Komentar anda sangat berharga bagi kami.. Silahkan berkomentar dengan baik dan sopan. Jika ingin menunjukan URL blog, silahkan berkomentar dengan format Nama/URL , karena komentar yang berisi Link akan kami hapus. Trimakasih..

close
 
Support : Network | Member | Register
Copyright © 2013. Cara Gampang - All Rights Reserved
Template Created by Cara Gampang Redesign by Cargam Template
Proudly powered by Blogger