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("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuR0u5GolU8SsF7xK2GN88YLkshvOqUT8Sz6F5xQo6DiHfo0zGIlqebUazSNHCsMepaISpva2pLaj2qnlsfrL_0mq3hdwt2n-d7nXaUB-QQa1QbCiZVrXEB-0AkyKlOaTXkhL7eWARywU/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.

Related Posts:

  • Gembira nya belajar mengutak-ngatik HTML dsn CSS 3 bulan ini saya banyak belajar tentang apa itu HTML dan CSS, saya mendapatkan pelajaran ini karena saya senang mengutak-ngatik template blog saya,sehingga secara tidak langsung saya belajar juga tentang HTML dan CSS. Tern… Read More
  • Kunci sukses ala pendiri microsoft. Siapa yang tahu siapa pendiri microsoft ? Harus tahu dong. Ialah si cerdas Bill Gates yang mendirikan perusahaan microsoft ini. Setiap orang pasti memiliki keinginan tersendiri,bahkan kunci sukses setiap individu pasti … Read More
  • Lirik beserta akord gitar tipe x boy band Boyband memang lagi ngtrend nya nih sekarang,nah tipe x menyuguhkan lagu dengan judul boyband nih. Lirik dengan akord gitar nya. Intro : C Am F G C Am F G C Memang banyak yang bilang, aku tampan rupawan … Read More
  • Cara membuat lencana facebook di blog Banyak sekali orang-orang yang suka ngeblog menambahkan widget yang diinginkan,termasuk salah satu nya adalah lencana facebook. Banyak sekali orang yang memakai nya. Screenshotnya seperti ini Nah jika anda juga ingin mem… Read More
  • Cara menyembunyikan email di facebook Email facebook merupakan suatu yang sangat berharga yang dimiliki,karena tanpa email itu kita tak akan bisa selancar di facebook tersebut,kecuali facebook yang memakai nomor handphone. Untuk menjaga keamanan dan privasi kit… Read More

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