RUMAH BELAJAR – Pada Tutorial sebelumnya sudah kami berikan kepada pengunjung setia ” RUMAH BELAJAR ” tentang Cara Pasang Widget Translate Bahasa di blogspot. Tutorial selanjutnya yang akan kami sampaikan kepada pembaca sekalian adalah Cara memasang like Box Facebook melayang di blog
Langkah pertama Login di blogger.com dengan user dan password yang anda punya
2. Kemudian anda pilih Layout /Tata Letal> Add gadget/Tambah Gadget > HTML/JavaScript
3. Kemudian copy dan paste script berikut ini
<!– Fanspage FB melayang tombol close –!>
<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 –!>
<div class=”fb-like-box” data-href=”https://www.facebook.com/pages/Rumah-Belajar/740080599373416″ data-width=”292″ data-show-faces=”true” data-stream=”false” data-show-border=”true” data-header=”true”></div>
<!– Selesai –!><a class=’close’ href=’#’>×</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.rumahbelajar.web.id”>Blogger Widget</a> and <a style=” font-size:10px; color:#3B78CD; text-decoration:none;” href=”http://www.rumahbelajar.web.id/cara-memasang-like-box-facebook-melayang-di-blog/”>Get This Widget</a></p>
</div>
4. Klik Simpan
Catatan :
Rubah Teks bercetak tebal pada javascript di atas
Demikian tutorial ” Cara memasang like Box Facebook melayang di blog ” semoga bermanfaat