Cara Memasang Widget Like Box Facebook Melayang di Blogspot - Ok sobat selamat pagi, kali ini Saya akan bagikan Artikel selanjutnya tentang Tutorial Blog Cara Memasang Widget Like Box Facebook Melayang di Blogspot. Memang untuk membuat fanspage/halaman Facebook Melayang di Blog sangat mudah kita tinggal cari kode script di Internet lalu kita copy paste di blog kita. Sebelumnya saya juga bagikan artikel yang sama tentang Cara Membuat Like Box Fanspage Facebook Pop Up Melayang.

Menurut saya dua-duanya bagus. Hanya berbeda untuk yang versi sebelumnya Tampilannya hanya muncul sekali aja ketika kita baru saja masuk blognya. Untuk yang versi ini Tampilannya muncul berkali-kali / muncul setiap postingan, halaman blog. Cara ini saya peroleh dari blog Bos-Tutorial. 

Untuk Caranya kita simak berikut INI :

  • Syarat utama : Memiliki Sebuah Halaman Facebook. Bila belum ada, silahkan buat dulu.. Setelah anda memiliki sebuah halaman facebook, ikuti langkah selanjutnya.
  • Buka Akun Blog yang anda kelola.
  • Pada Dasbor Blog anda, masuklah ke Elemen Tata Letak, pilih Add Widget / Tambah Gadget



  • Lalu pilih HTML/Javascript


  • Selanjutnya copylah kode script di bawah ini ke dalam Widget/Gadget Baru yang anda buat.

<!-- FB Melayang Tombol Close Mr Ivanchan--!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:40%;
margin:0px 0px 0px -182px;
width:310px;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
#kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script type='text/javascript'>
$(window).bind("load", function() {
// animasikan nilai top saat halaman telah selesai dimuat
$('#kotak-facebook').animate({bottom:"50px"}, 1000);
// hilangkan kotak pesan saat tombol (x) di klik
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='kotak-facebook'>
<p style=" margin-right:10px; font-size:15px; color:#000000;">Please Bantu Saya,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>

<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fweb.facebook.com%2FMrIvanchann%2F&tabs&width=290&height=154&small_header=true&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="290" height="154" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowtransparency="true"></iframe>

<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right; margin-right:35px; font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://www.mrivanchan.tk/">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="cara-memasang-widget-like-box-facebook-melayang-di-blogspot">Get This Widget</a></p>
</div>

  • Simpan Widget/Gadget Baru yang anda buat tersebut. 
  • Lihat hasilnya.

Perlu diperhatikan :

- Tulisan berwarna Merah adalah Kode Script dari Halaman Facebook Mr Ivanchan. Silahkan anda ganti Kode Script tersebut dengan Kode Script dari Halaman Facebook Anda.
- Bila tidak berhasil, coba ulang dari awal.
- Mohon Halaman Facebook Mr Ivanchan di Like juga yah

Demikian Tutorial tentang Cara Memasang Widget Like Box Facebook Melayang di Blogspot. Mohon maaf bila ada kata-kata yang sulit dipahami sobat. Bila ada yang mau ditanyakan silahkan komentar dibawahnya atau hubungi lewat laman Contact Us. Terima Kasih untuk kunjungannya...
Regards,
Mr Ivanchan
Fanspage Facebook

Cara Memasang Widget Like Box Facebook Melayang di Blogspot

Cara Memasang Widget Like Box Facebook Melayang di Blogspot - Ok sobat selamat pagi, kali ini Saya akan bagikan Artikel selanjutnya tentang Tutorial Blog Cara Memasang Widget Like Box Facebook Melayang di Blogspot. Memang untuk membuat fanspage/halaman Facebook Melayang di Blog sangat mudah kita tinggal cari kode script di Internet lalu kita copy paste di blog kita. Sebelumnya saya juga bagikan artikel yang sama tentang Cara Membuat Like Box Fanspage Facebook Pop Up Melayang.

Menurut saya dua-duanya bagus. Hanya berbeda untuk yang versi sebelumnya Tampilannya hanya muncul sekali aja ketika kita baru saja masuk blognya. Untuk yang versi ini Tampilannya muncul berkali-kali / muncul setiap postingan, halaman blog. Cara ini saya peroleh dari blog Bos-Tutorial. 

Untuk Caranya kita simak berikut INI :

  • Syarat utama : Memiliki Sebuah Halaman Facebook. Bila belum ada, silahkan buat dulu.. Setelah anda memiliki sebuah halaman facebook, ikuti langkah selanjutnya.
  • Buka Akun Blog yang anda kelola.
  • Pada Dasbor Blog anda, masuklah ke Elemen Tata Letak, pilih Add Widget / Tambah Gadget



  • Lalu pilih HTML/Javascript


  • Selanjutnya copylah kode script di bawah ini ke dalam Widget/Gadget Baru yang anda buat.

<!-- FB Melayang Tombol Close Mr Ivanchan--!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:40%;
margin:0px 0px 0px -182px;
width:310px;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
#kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script type='text/javascript'>
$(window).bind("load", function() {
// animasikan nilai top saat halaman telah selesai dimuat
$('#kotak-facebook').animate({bottom:"50px"}, 1000);
// hilangkan kotak pesan saat tombol (x) di klik
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='kotak-facebook'>
<p style=" margin-right:10px; font-size:15px; color:#000000;">Please Bantu Saya,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>

<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fweb.facebook.com%2FMrIvanchann%2F&tabs&width=290&height=154&small_header=true&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="290" height="154" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowtransparency="true"></iframe>

<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right; margin-right:35px; font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://www.mrivanchan.tk/">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="cara-memasang-widget-like-box-facebook-melayang-di-blogspot">Get This Widget</a></p>
</div>

  • Simpan Widget/Gadget Baru yang anda buat tersebut. 
  • Lihat hasilnya.

Perlu diperhatikan :

- Tulisan berwarna Merah adalah Kode Script dari Halaman Facebook Mr Ivanchan. Silahkan anda ganti Kode Script tersebut dengan Kode Script dari Halaman Facebook Anda.
- Bila tidak berhasil, coba ulang dari awal.
- Mohon Halaman Facebook Mr Ivanchan di Like juga yah

Demikian Tutorial tentang Cara Memasang Widget Like Box Facebook Melayang di Blogspot. Mohon maaf bila ada kata-kata yang sulit dipahami sobat. Bila ada yang mau ditanyakan silahkan komentar dibawahnya atau hubungi lewat laman Contact Us. Terima Kasih untuk kunjungannya...
Regards,
Mr Ivanchan
Fanspage Facebook

2 komentar: