Cara Membuat Facebook Fans Page Tersembunyi di Blog dengan Animasi jQuery

Masih berhubungan dengan artikel sebelumnya yaitu "Mengapa Harus Fans Page Facebook?". Menurut saya sebuah blog kurang lengkap bila belum memiliki Halaman Penggemar Facebook (Facebook Fans Page). Anda bisa melihat sendiri di berbagai web/blog yang sudah terkenal. Mereka biasanya memiliki Facebook Fans Page masing-masing.

Pada artikel kali ini saya akan memberikan cara untuk menyembunyikan Facebook Fans Page dengan animasi jQuery. Bagaimana? Anda tertarik untuk mencobanya? Namun sebelumnya anda harus mempunyai Facebook Fans Page terlebih dahulu. Jika Anda belum membuatnya, silakan baca artikel saya sebelumnya yang berjudul "Cara Membuat Facebook Fans Page dan Memasang Like Box di Blogspot".
Nah, sekarang kita langsung praktekkan saja. Ikuti langkah berikut.
  1. Seperti biasanya, pertama-tama, Masuk Blogger > Rancangan > Edit HTML.
  2. Kedua, cari kode </head> (gunakan Ctrl + F Untuk mempermudah pencarian).
  3. Ketiga,Copy Dan paste Kode Di bawah Ini Tepat sebelum kode </head>, Jika Anda sudah pernah memasang jQuery ini, maka langsung ke langkah 5 saja.
  4. <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
  5. Jangan lupa klik Simpan Template.
  6. Sekarang ke Rancangan > Elemen Lama > Tambah gadget > Html/JavaScript.
  7. Copy script di bawah ini lalu pastekan ke HTML/JavaScript yang Anda buka tadi.
  8. <script type="text/javascript">
    //<!--
    $(document).ready(function() {$(".sektimlikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
    //-->
    </script>
    <style type="text/css">
    .sektimlikebox{background: url("http://www.missneopoints.com/catalog/view/theme/default/social_share/fb1.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 100px;padding: 0 5px 0 30px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:200px;}
    .sektimlikebox div{border:none;position:relative;display:block;}
    .sektimlikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
    .sektimlikebox span a{color: #808080;text-decoration:none;}
    .sektimlikebox span a:hover{text-decoration:underline;}
    </style><div class="sektimlikebox" style=""><div>
    <iframe src="//www.facebook.com/plugins/likebox.php?href=http://facebook.com/Sektim.Area&amp;width=245&amp;height=330&amp;colorscheme=dark&amp;show_faces=true&amp;border_color=FFFFFF&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="background:#FFF; border:none; overflow:hidden; width:245px; height:330px;" allowtransparency="true" ></iframe><span><a href="http://sektim-area.blogspot.com/2012/04/cara-membuat-facebook-fans-page.html" target="_blank">Mau widget ini?</a></span></div></div>
  9. Ganti teks berwarna merah (url) pada baris terakhir dengan url facebook Anda.
  10. Dan terakhir, klik Simpan.

16 comments

Kalau bisa jangan pakek escape tuh, suka ke deteksi sama anti pirus...xixixi
Cuman link doang kan..hehehe

Reply

Gan Contoh URLnya Gimana sih ???
Maksud ane yang "URL anda di sini" itu URL nya yang mna ya ??

Reply

Pengen coba.
Kalau di blog ini sudah terpasang berarti cara disini memang bisa.
Thank's

Reply

Iya, silakan dicoba gan.
Hasilnya seperti yang di sebelah kanan blog ini.

Reply

test dulu ya sob.......

Reply

Bagus bro Informasinya sangt berguna nice post

Reply
This comment has been removed by the author.

ko' punya qw facebook fans nya tdk tampil ??

Reply

Kq psang FB pluginnya kosong gk ada apa" aneh polos bgt

Reply

Mantap sobat. salam kenal

Reply

Gan, yang di isi URL atau IFRAME atau lainnya, salam kenal gan...

Reply

makasih banyak ilmunya kang... sangat bermanfaat buat kami

Reply

bagus artikelnya gan makasih

Reply

Post a Comment