Lompat ke konten Lompat ke sidebar Lompat ke footer

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 :)

Jika kalian ingin memasang fanspage facebook melayang pada blog dan ingin responsive berar Cara Membuat Fanspage Facebook Melayang Di Blog

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


  1. Login ke blog kalian
  2. Pilih Layout/tata letak
  3. Tambahkan Gadget
  4. Pilih HTML/Javascript
  5. 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&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;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='#'>&times;</a> </div>

Note

- Ubah Kata1, Kata2, Kata3 sesuai yang kalian mau
- susiloblog ubah dengan alamat fanspage kalian

Selesai