Mendapatkan like dari pengunjung blog, Pengunjung akan mudah like facebook kita karena kotak like facebook di pasang di blog , Untuk menghilangkan kotak likenya sangat mudah tinggal pengunjung clik <X> pada atas kanan kotak dan tidak begitu mengganggu pengunjung blog.
Syarat Menggunakan Kotak Like Facebook Di Blog,
- Memiliki halaman di facebook , jika belum cari di google cara buat halamn facebook pasti ada.
- Masuk ke dashbor blog kita .
- Lalu masuk tataletak .
- Pilih tambahkan gadget .
- Pilih Html/JavaScript .
<!-- 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:#708090; font:normal 1em Cambria,Georgia,Serif;
color:#ffffff;
-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;">Suka Artikel Sistemrial ,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>
<div class="fb-like-box" data-href="https://www.facebook.com/Sistemrial-1702221923366248/" 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://sistemrial.blogspot.com/">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://sistemrial.blogspot.com">Get This Widget</a></p>
</div>
<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:#708090; font:normal 1em Cambria,Georgia,Serif;
color:#ffffff;
-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;">Suka Artikel Sistemrial ,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>
<div class="fb-like-box" data-href="https://www.facebook.com/Sistemrial-1702221923366248/" 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://sistemrial.blogspot.com/">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://sistemrial.blogspot.com">Get This Widget</a></p>
</div>
Sebelum kalian simpan edit dulu beberapa kode diatas,
kode https://www.facebook.com/Sistemrial-1702221923366248/ ganti dengan url halaman facebook kalian.
Kode warna merah ini #708090 ganti sesuai kebutuhan itu warna background kotak like facebook.
Kalo sudah diedit tinggal clik simpan/save.
Demikian tentang Cara Memasang Kotak Like Facebook Melayang Di Blog Jika ada yang ditanyakan silahkan komen , Terima Kasih
Silahkan Berkomentar Yang Baik Sesuai Topik , Mohon Jangan Menautkan Link Hidup / Link Mati Karena Akan Dianggap Spam EmoticonEmoticon