Cara Membuat Facebook Fan Page Melayang

hay sob.......
kali ini saya akan share tentang Cara Membuat Facebook Fan Page Melayang di Blog, lokasinya melayang di tengah-tengah blog, tapi bisa juga di samping kiri atau bahkan kanan blog.
manfaat kita menggunakan Fan Page melayang di blog ini menurus DANIARIS adalah.....

• Kita dapat menghemat tempat pada blog.

• Pengunjung blog Anda akan lebih mudah untuk menemukan menekan like. karena, lokasi like box fan page ini berada di tengah-tengah blog. jadi pengunjung blog Anda tidak susuah-susah lagi untuk mengklik like.

• Blog anda akan terlihat lebih rapi dan indah. Karena, tampilan dari Facebook Like Box Melayang ini bisa dibilang cukup menarik dan cukup indah untuk di pandang mata heheee : )

oke kita mulai saja ke Cara Membuat Facebook  Fan Page Melayang di blog :

1. Login ke blog yang anda miliki. klik
2. Pergi ke Dasbor > Template > Edit HTML
3. Cari </body> untuk mempermudah pencarian, silahkan tekan Ctrl + F
4.Copy-Paste Script yang ada di bawah ini di bawah </body>

<style type='text/css'>
.notification{width:350px;height:260px;display:block;position:fixed;bottom:100px;left:490px;/*Border Radius*/border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;/*Box Shadow*/-moz-box-shadow:2px 2px 2px #cfcfcf;-webkit-box-shadow:2px 2px 4px #cfcfcf;box-shadow:2px 2px 2px #cfcfcf}
.notification span{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYjSGBENXJSMycbWgctAWm7p2KAElVgmgPncMpYkayupcU8itIqP1Y77B6ISU5rw_ZP3IqUL4tKp5Rs5n91RA_FRb_jmscQagCG3Ss2HubE9I-hp2axaN9X-JPq0SMtBDrkoSXkTr0Uh4/) no-repeat right top;cursor:pointer;display:block;width:19px;height:19px;position:absolute;top:-9px;right:-8px}
.notification p{width:400px;font-family:Arial,Helvetica,sans-serif;color:#323232;font-size:14px;line-height:21px;text-align:left;float:right;margin:10px 15px 0 0;*margin-top:15px;/*for lt IE8*/padding:0;/* TEXT SHADOW */ text-shadow:0 0 1px #f9f9f9}
.warning{border-top:1px solid #fefbcd;border-bottom:1px solid #C5D5E6;/*Background Gradients*/background:#C5D5E6;background:-moz-linear-gradient(top,#fff,#C5D5E6);background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#C5D5E6))}
.warning:before{content:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA3QQFJ3SKlRFcR2shJ8-cOJmOlVyrOYcEmVZ46m0wdQ-6gDrkn1_h5ThfhgcNChEJjbqAd_boLhic7lagFjJtnOSrntWAme9XT_pj9VSZrN6ItMaV3K8uAgY302qbxC6VcequyfwpZTk/);float:left;margin:5px 0px 0 5px}
.warning strong{color:#e5ac00;margin-right:15px}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){$(&#39;.notification&#39;).hover(function(){$(this).css(&#39;cursor&#39;,&#39;auto&#39;);});$(&#39;.notification span&#39;).click(function(){$(this).parent().fadeOut(800);});});</script>
<div class='notification warning'><span/>
<center>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fdaniaris1oke&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=222240497894167' style='border:none; overflow:hidden; width:292px; height:258px;'/>
</center></div>

4. Save template Anda.....

Selamat mencaoba dan semoga bermanfaat......

Categories: Tutorial Blog