Cara Memasang Widget Facebook (FB) Like Tersembunyi - BBT: Cara memasang widget facebook / fb like di blog menggunakan script jQuery, ini mudah kok, tidak perlu edit template segala

Cara Memasang Widget Facebook (FB) Like Tersembunyi

Bagi sobat yang memiliki halaman facebook untuk blog atau bisnis tentu tahu dong bahwa pihak facebook telah menyediakan sebuah widget yang bisa kita pasang di blog maupun website.

Dengan memasang widget halaman tersebut pengunjung dapat dengan mudah memberikan like untuk halaman kita.

Biasanya tampilan widget tersebut seperti ini
FB LIKE
Untuk mendapatkan widget halaman fb yang memiliki tombol like / suka kita bisa membuka halaman ini https://developers.facebook.com/docs/plugins/page-plugin, kemudian mengatur tampilan widget tersebut.

Setelah selesai mengatur widget tersebut, maka kita cukup mengklik tombol Dapatkan  Kode kemudian memasang kode di blog.

Kita bisa memasangnya langsung di sidebar blog atau membuatnya tersembunyi, dan ketika pengunjung mengarahkan kursor ke widget FB like tersembunyi yang dipasang, maka baru widget tersebut terlihat.

Lalu bagaimana cara memasang widget facebook / fb like tersembunyi ?

Nah, bagi sobat yang ingin memasang widget fb like tersembunyi di blog, silakan ikuti langkah - langkah berikut :
  1. Masuk ke dasbor blogger
  2. Buka halaman Tata Letak
  3. Klik tambahkan widget (posisi terserah, tapi sebaiknya pilih widget bagian bawah saja)
  4. Pilih widget HTML/JavaScript
  5. Masukkan kode yang saya sertakan di bawah nanti pada bagian Konten
  6. Klik Simpan
  7. Selesai
Berikut kode yang harus dipasang

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".fblikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.fblikebox{background: url("https://3.bp.blogspot.com/-Mrlf8lob-MA/WExFnBpPULI/AAAAAAAAFmE/qNv7-BRhRbsrdcjlx7WGL54IqdU2Cp2BgCLcB/s1600/fblikewidget.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.fblikebox div{background:#ffffff;border:none;position:relative;display:block;}
</style>
<div class="fblikebox">
<div>
PASANG KODE WIDGET HALAMAN FACEBOOK SOBAT DI SINI
</div>
</div>
Keterangan :
  • Kode <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script> adalah script jQuery Library, dan jika template blog sobat sudah menggunakan script jQuery Library, maka silakan hapus kode ini.
  • Pada kode di atas juga terdapat tulisan PASANG KODE WIDGET HALAMAN FACEBOOK SOBAT DI SINI, silakan ganti tulisan tersebut dengan widget halaman fb sobat
Untuk mendapatkan widget halaman fb silakan klik link yang sudah saya sertakan di atas tadi.

Jika sobat ingin melihat demo nya, silakan lihat di samping kanan blog ini, kemudian arahkan kursor ke gambar yang bertulis Facebook tersebut.

Semoga bermanfaat.



FB LIKE

INI CUMA DEMO SAJA

loading...
Lihat / Tinggalkan Komentar
- Powered by Blogger. Ahmad Rifai - Cara Membuat Blog

Terimakasih telah membaca , semoga artikel tentang Cara Memasang Widget Facebook (FB) Like Tersembunyi yang ada di blog ini bermanfaat buat sobat