RSS

Cara Memasang Floating FanPage Like Facebook Pada Blog


 Kembali membahas tentang facebook 
  Floating Fan Page Facebook merupakan widget yang kita tambahkan pada blog untuk mempercantik tampilan blog sekaligus menata dengan rapi widget-widget yang sudah terpasang pada blog. Sebelumnya saya juga sudah pernah bahas tentang cara pasang auto twitt box widget pada blog. Dan pada kesempatan kali ini, saya akan memberikan tips blog lagi yaitu Cara Memasang Floating Fan Page Facebook Pada Blog. Sebagai gambaran awal dari Floating Fan Page Facebook pada blog, teman-teman bisa melihat contohnya pada widget fan page yang saya sudah pasang pada blog ini. Pemasangan widget like fan page ini tidak akan berjalan dengan lancar bilamana teman-teman blogger belum membuat halaman fan page pada facebook sebelumnya. Untuk itu, silakan buat dulu halamannya. Dan untuk membuat halaman fan page pada facebook, silakan tanyakan saja pada Om Google/buat halaman pada facebook . saya kira kalian juga udah tau pastinya apa itu fanpage /halaman facebook. atau sedikit gambaran dari saya lihat tautan gambar dibawah ini . 

jika belum punya fanpage silahkan menuju Create facebook page

pilih sesuai dengan jenis fans page. Di sini ada enam kategori fans page yaitu Tempat atau Bisnis Lokal; Perusahaan, Organisasi, atau Institusi; Merek atau Produk; Artis, Band, atau Tokoh Masyarakat; Hiburan; Perjuangan atau Komunitas.


fanpage


Untuk sobat blogger yang sudah punya halaman fan page pada facebook dan ingin memasang widget floating fan page facebook pada blog, silakan ikuti langkah-langkahnya di bawah ini :
.Silakan login ke akun blog Anda.
.Pada halaman dasbor akun blog, silakan  pilih template-edit HTML-Prossed-expand widget template.
.Selanjutnya silakan cari kode ]]></b:skin>. agar lebih cepat dalam mencari silahkan gunakan tombol "F3" lalu pastekan code pada kotak pencarian setelah jendela muncul.
.Kalau sudah ketemu kodenya, silakan copy dan paste kode di bawah ini pas di bawah kode ]]></b:skin>

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

.KEMUDIAN silakan simpan template 
. pilih lagi layout, lalu pilih dan klik Add Gadget pada posisi mana saja.

.Setelah muncul jendela Add Gadget Blogger, silakan pilih HTML/JavaScript dengan cara klik tombol plus [+] yang ada disebelah kanannya.
.selanjutnya, silakan copy kode di bawah ini dan paste pada bagian content.



<script type="text/javascript"> /*<![CDATA[*/ jQuery(document).ready(function() {jQuery(".likebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);}); /*]]>*/ </script> <style type="text/css"> .likebox{background: url("http://1.bp.blogspot.com/-9eRHiE20E4c/TynfIJyt7qI/AAAAAAAACBE/15Q3VtI-PwY/s1600/fb.png") no-repeat scroll left top transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed; right:-250px;top:44%;} .likebox div{border:none;position:relative;display:block;} .likebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 99999;} .likebox span a{color: gray;text-decoration:none;} .likebox span a:hover{text-decoration:underline;} </style> <div class="likebox" style=""> <div> <iframe src="http://www.facebook.com/plugins/likebox.php?href=GANTI DENGAN URL FANPAGE&amp;width=240&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 258px; width: 245px;background:#fff;"></iframe> </div> </div>



Setelah dipaste kodenya pada bagian content, jangan dulu disimpan kodenya tapi silakan ganti TULISAN YG BERCETAK TEBAL dengan alamat atau URL halaman fan page facebook Anda. Setelah diganti kemudian save / simpan.

 Eit jangan pergi dulu ,,, untuk code yang di atas bentuk widget akan menyerupai buku tamu yg tersembunyi di bagian side bar, namun jika agan menginginkan yg tampilan di bagian kolom widget silahkan gunakan code berikut:


<div class="w2bslikebox" style="right: 0px; "><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FWr17%2F327130390704930&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="yes" frameborder="0" style="border: medium none; overflow: hidden; height: 270px; width: 270px;background:#fff;"></iframe><span>By <a href="http://alvizcyber.blogspot.com/2012/09/cara-memasang-floating-fanpage-like.html">Pasang widget</a> / <a href="http://alvizcyber.blogspot.com/2012/09/cara-memasang-floating-fanpage-like.html">Dapatkan Code</a></span></div></div>


Ganti Tulisan "Wr17" dengan nama fanpage agan  dan ganti juga Id : 327130390704930 ini terdapat pada bagian akhir url fanpage . Semoga bisa bermanfaat


Jika tertarik dengan fanpage auto hiden seperti pada blog ini dengan fersi saya silahkan tinggalkan komentar .  
                                   Build your Twitter account with ManageFlitter
Judul: Cara Memasang Floating FanPage Like Facebook Pada Blog
Rating: 100% based on 10 ratings. 5 user reviews.
Ditulis Oleh Kumbara Scarletser

Terimakasih atas kunjungan Sobat beserta kesediaan Anda membaca artikel ini. Kritik dan Saran sobat dapat sampaikan melalui Kotak komentar dibawah ini.
  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

Related Posts

2 komentar:

toko online unik said...

Blognya keren bangat gan, pakai template apa ya? postingnya juga sangat bermanfaat

Alviz Stevano said...

Makasih kunjungannya gan , ane pake template mode Gamenow,