Cara Menciptakan Fanspage Facebook Melayang Di Blog
Jika kalian ingin memasang fanspage facebook melayang pada blog dan ingin responsive berarti kalian sudah sempurna membaca postingan ini. Saya gres saja memasang fanspage melayang ini pada blog saya ini. Makanya sebelum melanjutkan membaca goresan pena ini, mohon like terlebih dahulu fanspage saya :)
Sebenarnya cara ini sudah banyak blogger yang membahas. Tp kalau kalian gagal atau tidak dapat diterapkan berarti scriptnya sudah basi. Silakan coba caraku ini
- susiloblog ubah dengan alamat fanspage kalian
Selesai
Sebenarnya cara ini sudah banyak blogger yang membahas. Tp kalau kalian gagal atau tidak dapat diterapkan berarti scriptnya sudah basi. Silakan coba caraku ini
Cara Membuat Fanspage Melayang Blog
- Login ke blog kalian
- Pilih Layout/tata letak
- Tambahkan Gadget
- Pilih HTML/Javascript
- Copikan code dibawah ini
<style type='text/css'> /* Message Box Facebook Melayang By */ #box-message { position:fixed !important; position:absolute; top:-1000px; left:50%; margin:0px 0px 0px -182px; width:340px; height:auto; padding:16px; background:#fff; font:normal Dosis, Georgia, Serif; color:#111; border:3px solid #333; -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; } #box-message a.close { position:absolute; top:-10px; right:-10px; background:#fff; font:bold 16px Arial, Sans-Serif; text-decoration:none; line-height:22px; width:22px; text-align:center; color:#111; border:2px solid #333; -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:22px; -moz-border-radius:22px; border-radius:22px; cursor:pointer; } </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type='text/javascript'> $(window).bind("load", function() { // Animate Top Value When Page Loaded Completed $('#box-message').animate({top:"50px"}, 1000); // Remove Mailbox When Close Button On Click $('a.close').click(function() { $(this).parent().fadeOut(); return false; }); }); </script> <div id='box-message'> <!-- HTML Start --> <center><a class="murub">KATA1<br/> <br/>KATA2<br/>KATA3</a></center> <center><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/susiloblog&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:215px;" allowtransparency="true"></iframe> </center> <!-- HTML FB End --> <a class='close' href='#'>×</a> </div>
Note
- Ubah Kata1, Kata2, Kata3 sesuai yang kalian mau- susiloblog ubah dengan alamat fanspage kalian
Selesai