Cara membuat Widget Like Box FansPage Fb Melayang di Blog
Langsung saja Tothepoint. DEMO : KLIK DISINICara pemasangan.
1. Masuk BLOGGER.COM -> Tata Letak -> Add Gadget -> Pilih Html/Javascript
2. Masukan kode dibawah ini ke dalam kolom yang sudah disediakan ( Tanpa Judul )
<a href="https://twitter.com/keheds321" class="twitter-follow-button" data-show-count="false" data-size="large" data-dnt="true">Follow @keheds321</a>Sumber kode : svshare7.blogspot.com
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
<!-- 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 --!>
“<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fbsederhana.id&width=300&height=290&colorscheme=light&show_faces=true&header=true&stream=false&show_border=true&appId=417513225020019" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:290px;" allowtransparency="true"></iframe>”
<!-- 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://svshare7.blogspot.com/ ">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href=" http://masgober.blogspot.com/ ">Get This Widget</a></p>
</div>
Kode diatas saya tambah dengan Follow Twitter.
Kalo mau dihapus tinggal hapus mulai dari <a href="https://twitter.com/keheds321" SAMPAI -> 'twitter-wjs');</script>
3. Ubah Kode Yang berwarna merah dengan ID Fanspage anda sendiri. Kalo belum tahu, Apa itu ID Facebook fanspage coba cari di Google. Misalnya gini, ID Fanspage saya http://facebook.com/bsederhana.id yang berwarna merah adalah ID Fanspage saya.
4. Save :)
Cara membuat Widget Like Box FansPage Fb Melayang di Blog
~ENJOY IT
thx atas tutor.a
ReplyDeletethanks gan bermanfaat banget
ReplyDeletescript nya bisa buat blog jadi lelet gx gan ???
ReplyDeletekren banget gan
ReplyDeleteoh ya ada yang lupa, saya mau tanya gimana cara masangnya kalau disini kaka Sepatu Adidas Running
ReplyDeletekoq yg muncul hanya headerx gan??
ReplyDeleteok gan berhasil mksh info yaa, mampir gan
ReplyDeleteCara Menggunakan Bootstrap
Tahnk's
ReplyDeletewah keren artikelnya gan....
ReplyDeletemantap dah...
thx sob
ReplyDeletewww.idcheat.com
Thank sob janan lupa kunbal www.sangpenuliswaktu.blogspot.com
ReplyDeleteTerima kasih Infonya Bro, izin ikut menerapkan ya. hehe
ReplyDeleteInformasi Lowongan Kerja Terbaru BUMN, Persero, Swasta, & Berbagai Perusahaan Besar di Indonesia : http://expocpnsbumn.blogspot.com
mantab.. terimakasih banyak buat script tutorialnya...
ReplyDeletehttp://bit.do/2SXk
makasih banyak buat infonya,,
ReplyDeletehttp://goo.gl/IR7XZj
makasi ilmu pengetahuannya gan
ReplyDeleteinjin mencobanya gan
ReplyDeleteburung kenari
furniture