Saturday, 4 May 2013

Cara Membuat FansPage Facebook Auto Hide di Blog

Ini saya tulis berdasarkan yang ditanyakan oleh mas AIKON MEDIA di  postingan terdahulu saya yaitu CARA MEMBUAT LENCANA FACEBOOK DI BLOG.

Untuk cara membuat Fanspage facebook yang auto hide ini cukup mudah,hanya terdapat beberapa cara.

Saya langsung saja bahas.

1. Log in dulu di Blog anda.
2. Masuk ke rancangan/template dan klik EDIT HTML.
3. Cari kode </head> ,untuk memudahkan silahkan tekan Ctrl+F.
4. Letakan kode dibawah ini tepat diatas kode </head>.


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

5. Lalu anda masuk ke Tata Letak / Layout dan tambahkan gadget baru dan pilih tambahkan HTML/Javascript dan masukan kode dibawah ini.



<script type="text/javascript">
//<!--
$(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{background: url("http://3.bp.blogspot.com/-VXmAJdQRHJ8/Tra8E16fZGI/AAAAAAAAClg/o5M632x9qX8/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.floatinglikebox span a{color: #808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox" style=""><div><iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Finger21blogspotcom/501549656554161?ref=hl;width=251&amp;height=400&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23cccccc&amp;stream=false&amp;header=false&amp;appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:400px; background:#fff;" allowtransparency="true"></iframe><span><a href="" target="_blank">+ Get This Widget</a></span></div></div>

 6. Klik save dan selesai.

Untuk kode yang berwarna merah silahkan ganti dengan URL Fanspage anda.
Mohon maaf tulisan nya acak-acakan,karena saya lagi buru-buru ada acara lain. Terima kasih mas.

Jika ada waktu saya akan edit ulang postingan ini.

5 comments:

  1. Replies
    1. ia mas.. Terima kasih telah berkunjung.

      Delete
  2. mantep bos....terus caranya ganti nama buku tamu gimana.....

    ReplyDelete
  3. wah hebat, tq gan,bermanfaat..visitback ya www.gudangteknoz.blogspot.com , ada dp bbm terbaru..

    ReplyDelete