Buat Like FansPage Fb Melayang Keren

Membuat FB Like Box Melayang Slide Close

Pagi ini saya akan mencoba sharing sebuah widget facebook like box yang melayang dengan tombol close dengan efek slide ketika di tekan. Saya mencoba menggabungkan kode-kode script yang saya dapat dari bloger-bloger lain selama belajar blogging yang saya tekuni selama ini dan hasilnya menurut saya lumayan untuk diterapkan di blog. Bagi para master, tolong kasih masukan tentang widget ini kalau ada kesalahan. Widget ini lumayan simpel karena tidak perlu mengobok-obok HTML template blog Anda.

Bagi yang ingin mencoba menggunakannya di blog, silahkan ikuti caranya di bawah ini.
  1. Seperti biasa silahkan login ke blog Anda.
  2. Dashboard >> Layout >> add a gadget >> pilih HTML/JavaScript, kemudian copy dan paste kode di bawah ini.
<div style="display:scroll;position:fixed;top:50px;left:400px;">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://yourjavascript.com/4131855615/slidefbnew.js" type="text/javascript">
</script>
<style>
#kompiajaib_slidefb2012{
font-family: "Consolas", "Courier New", Courier, mono, serif;
border: 1px solid;
width: 355px;
margin: 10px 0px;
padding:5px 0px 0px 5px;
background-repeat: no-repeat;
position:relative;
color: #00529B;
background-color: #000000;
}
</style>
<div id="kompiajaib_slidefb2012">
<a class="close"  href="#close" style='position:absolute;right:0px;top:0px;margin-right:-1px;margin-top:-1px;'><img border="0" src="http://1.bp.blogspot.com/-xjVGllNNS5Q/T66Pa1LuFZI/AAAAAAAADKs/8Nf9hrNZGpA/s1600/popover-close-button.gif" /></a>
<div style='width:99%;padding:8px 0px;background-color:#737373;font-family:arial;text-align:center;'><div style='color:#FFF;font-size:13px;font-weight:bold;'>Like us and get updates</div></div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Rehan_Wizze/366033770156179?fref=ts&amp;width=350&amp;height=255&amp;colorscheme=dark&amp;show_faces=true&amp;border_color=%23FFFFFF&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:350px; height:255px;" allowtransparency="false"></iframe><div style="border: 0px; padding: 5px; background-color: none; text-align: right; font-size:9px;">Get This<a href="http://rehan-wizze.blogspot.com/2013/06/buat-like-fanspage-fb-melayang-keren.html#close" target="_blank">Widget</a></div>
</div></div>

Warna background widgetnya hitam atau dark.
#000000 adalah background widget, silahkan sesuaikan dengan template Anda.
http://www.facebook.com/pages/Rehan_Wizze/366033770156179?fref=ts silahkan ganti dengan URL facebook Anda.
Jika background widgetnya terang, silahkan ganti dark dengan light
Previous
Next Post »

1 komentar:

Click here for komentar
Thanks for your comment