Tiada Hari Tanpa Belajar

Cara Mudah & Praktis Membuat Fans page Facebook Di Blog Tampilan Auto hidden

Advertisement
Cara Membuat Fans page Facebook Di Blog Tampilan Auto hidden / Tersembunyi. Fans fage facebook adalah salah satu widget favorit para blogger. kenapa tidak? karena dengan Membuat Fans page Facebook Di Blog akan menambah "reputasi" blog kita di Facebook. 



Tampilan Fans page Facebook bisa Anda lihat keluar dan muncul pada samping kanan blog dan tidak mengganggu anda karena dengan klik exit maka kotak tersebut akan sembunyi di samping kanan. gimana minat tidak memasangnya ?!

Oke langsung saja Bagaimana Cara Membuat Fans page Facebook Di Blog Tampilan Tersembunyi, berikut caranya:

Pasang kode jquery ini pada template Anda dan letakkan pas diatas </head> 
Berikut kodenya : 

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

 
Kemudian setelah kode tersebut terpasang lalu langkah selanjutnya adalah pemasangan kode facebook fanpage pada widget dengan menambahkan gadget.
  1. Login ke blogger Anda atau klik www.blogger.coms
  1. Silahkan menuju tata letak / Layout kalau dalam bahasa inggris
  1. Tambah gadget dan pilih html/javascript
  1. Lalu copy dan paste kode berikut :
    <script src="http://infonetmu.googlecode.com/files/slidboxordinary.js" type="text/javascript"></script><div id="fbslidebox" style="position: fixed; width: 330px; overflow: hidden; bottom: 20px; right: 10px; background: url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigaAuO6yzH16TaCl9jc1p93PgBU_I4AU5k6L5GuhyphenhyphenXlIBoJC-QI3pVhSU3hHaOFlyqk5BGgKwbxHvvlArj318sYSOuqKvm4ojv1YKrYwBO3G8Zvtx_shyphenhyphenFJcQjgvYar4MB7eLrb04rViw/s0/bo-bg-html.gif&quot;) repeat scroll 0% 0% transparent; -moz-border-radius: 15px 15px 15px 15px; border: 2px solid rgb(17, 17, 17); display: block;">
    <div style="width: 320px; padding: 10px; margin: 0pt auto; overflow: hidden;">
    <a id="fbcloseslidebox" style="float: right; color: rgb(153, 153, 153); padding: 0pt 3px; border: 1px solid rgb(204, 204, 204); text-decoration: none; font-size: 9px; font-family: Verdana,Geneva,sans-serif;" href="http://www.blogger.com/post-create.g?blogID=4155701203275692831#">Exit</a>
    <strong style="color: rgb(102, 173, 61);">Jangan Lupa Klik Like Ya</strong>
    <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FInfonetmu&amp;width=300&amp;height=290&amp;colorscheme=dark&amp;show_faces=true&amp;border_color=ff0000&amp;stream=false&amp;header=true&amp;appId=287998221248983" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:290px;" allowtransparency="true"></iframe>
    </div></div> 
  1. Kemudian save 
Catatan : Ganti kode yang berwarna biru dengan kode frame yang kamu dapat saat membuat fanpage facebook. Bagi Anda yang belum punya kode warna merah tersebut silahkan menuju facebook dan buat fanpage terlebih dahulu.
1. Langkah pertama Anda login terlebih dahulu di account Facebook Anda :
2. Lalu buka halaman :  Facebook Page
3. Pilih/klik opsi Merek atau Produk


4. Pilih opsi no.1"website" dan isikan no.2"nama Page" sesuai dengan yang anda diinginkan. centang "Persetujuan" dan klik "Mulai" :



5. Kemudian masuk ke halaman Facebook Page yang Anda telah buat. Lakukan kostumisasi terlebih dahulu sesuai petunjuk, misalnya mengupload foto/gambar untuk Facebook Page, mengedit informasi, dan lain sebagainya, atau langsung membuat Facebook Like Box yang nantinya dapat dipasang di blog/website.

CATATAN : Sebelum lanjut langkah berikutnya, copy url Facebook Fan Page yang telah Anda dibuat. Fungsinya sebagai spesifikasi url untuk like box yang nantinya hendak dibuat.
Contoh url-nya: http://www.facebook.com/pages/K-T-B/300432780037612


6. Kemudian Anda pilih menu nomer 5 dan klik "add like box" atau bisa dengan membuka halaman : Like Box

7. Selanjutnya, isikan spesifikasi :
Setting Facebook Like Box:

1. Facebook Page url: paste url Facebook Page yang di copy tadi

2. Width: lebar tampilan facebook like, sesuaikan dengan lebar sidebar widget pada blog Anda.


3. Height: adalah tinggi like box, sesuaikan juga dengan widget pada blog Anda.


4. Color scheme: pilih light jika ingin tampilan terang, dan dark untuk tampilan gelap.


5. Show Faces: Centang bila anda ingin menampilkan foto profil likers.


6. Border color: Isikan dengan kode warna jika ingin memberi border atau kosongkan agar transparan.


7. Show stream: Centang bila anda ingin menampilkan informasi/posting terakhir di like box.


8. Show header: Centang bila anda ingin menampilkan tulisan header "Temukan kami di Facebook".


Lihat preview tampilan :

8. Kemudian setelah settingan yang dibuat sudah selesai, klik Get Code. setelah itu akan muncul pop-up window yang menampilkan 3 jenis kode, HTML5, XFBML dan IFRAME pilih salah satu dan copy kodenya. (Untuk Blogger, disarankan pilih HTML 5).

Copy ke dua kode di atas kemudian gantikan dengan kode berwarna biru.
Teks Warna Hijau silahkan ganti sesuai Teks selera kamu.

Sekian tutorial Cara Membuat Fans page Facebook Di Blog Tampilan Auto hidden / Tersembunyi.  

Semoga bermanfaat
 


0 Komentar untuk "Cara Mudah & Praktis Membuat Fans page Facebook Di Blog Tampilan Auto hidden"

Back To Top