Berbagi ilmu itu akan terasa nikmat apabila ilmu itu bermanfaat

Monday, May 16, 2011

Cara Memasang Tombol Facebook Like / Recommend untuk Blogger/Wordpress

Facebook telah menyetting sebuah plugin sosial baru yang memungkinkan kita untuk berbagi pengalaman menarik atau hal yang disukai di sebuah website atau blog kepada pengguna lainnya hanya dengan sebuah tombol.


Contohnya seperti tombol diatas. Tombol ini akan terpasang di seluruh halaman posting blog, dan untuk setiap halaman posting berbeda-beda jumlah orang yang "like/recommend". Jumlahnya ya tergantung berapa banyak orang yang menyukai halaman / postingan tersebut.

Bagaimana menambahkan tombol facebook like di setiap post?

- Memasang Tombol di template Blogspot/Blogger (XML)

1. Login ke akun Blogger dan buka menu Layout > Edit HTML dan klik "Expand Widget Templates"
2. Cari kode <data:post.body/>, dan simpan kode tombol facebook like dibawah ini persis dibawahnya.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>
Kode ini hasilnya berupa tombol Like.
3. Simpan Template.

Pilihan style untuk tombol.

a) Coba ganti action=like menjadi action=recommend. Dan hasilnya seperti tombol dibawah ini.



b) Coba ganti colorscheme=light menjadi colorscheme=dark atau colorscheme=evil.

c) Spbat juga bisa mengganti jenis huruf yang digunakan dengan mengganti font=arial dan ganti dengan:
  • font=lucida+grande
  • font=font=segoe+ui
  • font=font=tahoma
  • font=trebuchet+ms
  • font=font=verdana

- Memasang Tombol di template Wordpress.org (PHP)

Di menu Dashboard, masuk ke Appearance -> Editor (Themes editor). Buka template Single Post (single.php) atau Page Template (page.php). Carilah kode <?php the_content(); ?> atau
<?php the_content('(Read the rest of this entry...)'); ?>
lalu di atas/di bawahnya tambahkan kode:
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink() ?>&action=like&layout=standard&show_faces=true&width=450&font=arial&colorscheme=light" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:450px; height:25px;"></iframe>

- Memasang Tombol di Sidebar/Widget/Halaman Statis (HTML)

<script type="text/javascript">
document.write('<iframe src="http://www.facebook.com/plugins/like.php?href=' + escape(location.href) + '&action=like&layout=standard&show_faces=true&width=100%&font=arial&colorscheme=light" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:100%; height:25px;"></iframe>');
</script>