Membuat Button Like Fanspage dan Twitter Melayang di Blog

Kali ini saya akan mencoba sharing sebuah widget facebook like box yang melayang dengan tombol close dan di barengi dengan tombol follow twitter 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. hasilnya akan seperti ini

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 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://kompiajaib.googlecode.com/files/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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgy0HHqLaupiRCbl5dH0mv7i7GfoSZLHQFfDYSyqyhyWdAmdEGVF3gR-tA1UDvqhEqbkrCsnhQeUOOp_dCaPp-nAXmbUh6Re3nKA6gOyDtWsjeTSOQotoZDs_9SVLF6fAYG87O8aVvwo4PK/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>
<a href="https://twitter.com/giray681" title="giray681" class="twitter-follow-button" data-button="grey" data-text-color="#000000" data-link-color="#ffffff">Follow @giray681</a>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Serba-Ada/379706212107831&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;">Powered by <a href="http://girayinformation.blogspot.com/2012/11/membuat-button-like-fanspage-dan.html" target="_blank">girayraspati</a></div>
</div></div>

keterangan :
Untuk  https://twitter.com/giray681 ganti dengan url twitter anda @giray681 ganti dengan akun twitter sobat
Untuk  https://www.facebook.com/pages/Serba-Ada/379706212107831 silahkan ganti dengan alamat URL Fan Page Anda..

Sekian yang dapat saya bagikan, semoga bermanfaat. Terima Kasih...

Related Post:

Widget by [ girayraspati ]

Posted in: Tutorial Blogger