Cara Membuat Facebook Fan Page Tersembunyi di Sidebar, ketika Disentuh Muncul

Saturday, 13 July 2013

Cara Membuat Facebook Fan Page Tersembunyi di Sidebar, ketika Disentuh Muncul

Pada kesempatan ini saya akan berbagi Cara Membuat Facebook Fan Page Tersembunyi di Sidebar Blogger, ketika Disentuh Muncul.

Saya anggap anda sudah punya Facebook Fan Page. Dan jika belum, pelajari cara membuatnya disini.

1. Login ke Blogger.

Pilih Template >> Edit HTML

Cari kode </head>, letakkan kode di bawah ini tepat diatas kode </head>



 <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

Simpan Template anda.

2. Buka LayOut >> Add Gadget >> HTML/Java Script.

Copy kode di bawah ini.


<script type="text/javascript"> 

//<!-- 

$(document).ready(function() {$(".w2bslikebox").hover(function() 

{$(this).stop().animate({right: "0"},      "medium");}, function() 

{$(this).stop().animate({right: "-250"}, "medium");}, 500);});

//--> 

</script>

<style type="text/css">

.w2bslikebox{background: 
url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCeDsmL2VVwBq89WJJDdoh9fLmlfVByXdfjkYqH5TXKOSlG4Z_9m6BRxPXs8oTtOYeHGVyGRyQnbDP2q16BzITSBF3sY1ndDmyoQqxZvWLAPw2tyEyZao5Q0kH0ysphKATV_sP7tVnyF5x/s150/w2b_facebookbadge.pn")
 no-repeat scroll left center transparent !important;display: 
block;float: right;height: 270px;padding: 0 5px 0 46px;width: 
245px;z-index: 99999;position:fixed;right:-250px;top:20%;}

.w2bslikebox div{border:none;position:relative;display:block;} 

.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: ab

solute;right: 6px;text-align: right;z-index: 99999;}

.w2bslikebox span a{color: #808080;text-decoration:none;}

.w2bslikebox span a:hover{text-decoration:underline;}

</style><div class="w2bslikebox" style=""><div>

<iframe src="//www.facebook.com/plugins/likebox.php?href=

http://www.facebook.com/pages/Tutorial-Blogger-News/121596411325331



&amp;width=270&amp;height=245&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=true&amp;appId=138085536301890"
 scrolling="no" frameborder="0" style="border:none; overflow:hidden; 
width:270px; height:245px;background:fff" 
allowtransparency="true"></iframe></div></div>