Membuat Like Button Facebook di WordPress

By kakaeriel Posted on May 17, 2010 14 Comments

Like Button Facebook adalah Social Plugins yang memungkinan pengguna untuk berbagi halaman blog kamu kepada teman-teman mereka melalui media facebook.

Saya menganggap kamu sudah sedikit mengerti fungsi dari setiap file yang ada di wp-content/theme/nama-theme/

Ada dua cara mengaktifkan Social Plugins Facebook, pertama menggunakan <iframe> dan yang kedua menggunakan XFBML.

- Menggunakan <iframe>

Aktifkan file single.php lalu sisipkan script dibawah ini, ditempat dimana kamu akan memasang button like.

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink()?>&amp;layout=standard&amp;show_faces=true&amp;width=500&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:500px; height:86px"></iframe>

Script di atas sebenarnya dapat kamu manipulasi sesuai keinginan melalui link ini.

- Menggunakan XFBML

Untuk menggunakan XFBML, kamu harus mengaktifkan Javascript SDK. Lalu sisipkan code berikut di file single.php

<fb:like href="http://developers.facebook.com/" width="450" height="80"/>

Dua jenis script diatas hanya berfungsi menampilkan button like dihalaman blog kamu, untuk menampilkan hasil klik pengguna ke halaman beranda-nya, kamu harus mengkonfigurasi meta tag di file header.php

Ada 3 jenis tampilan yang akan keluar di facebook pengguna setelah dia mengklik tombol like di halaman blog kita. Pertama di wall mereka, kedua di beranda mereka dan ketiga di halaman info bagian likes and interest.

<html xmlns:og="http://opengraphprotocol.org/schema/"
xmlns:fb="http://www.facebook.com/2008/fbml">
<head>

<meta property="og:title" content="</code><?php the_title();?><code>"/>
<meta property="og:type" content="blog"/>
<meta property="og:url" content="</code><?php the_permalink()?><code>"/>
<meta property="og:image" content="http://kakaeriel.com/logo.jpg"/>
...
</head>
</html>

og:title - adalah judul dari halaman anda yang akan dibagi, WordPress sudah memiliki fungsi the_title(); yang berfungsi mengambil judul dari setiap postingan kita. Jadi kita cukup memasang code <?php the_title();?> saja.
og:url – adalah link yang nantinya berfungsi membawa teman dari pengguna ke halaman blog anda. Gunakan fungsi the_permalink() yang sudah disediakan oleh wordpress.
og:site - adalah nama blog kamu.

Jadi setelah kamu memadang script di atas, maka ketika ada pengguna yang menggunakan Button Like di halaman blog kamu, maka di beranda pengguna akan tampil seperti berikut:

- Francis Luu: adalah nama pengguna yang mengklik button like di halaman blog kamu.
- The Rock: adalah judul dari halaman blog kamu. Ini adalah hasil dari og:title dan the_title().
- IMDb: adalah nama blog kamu. Hasil dari og:site.

og:type - memungkinkan teman anda memasang halaman anda di page info bagian likes and interest.

Sebagai informasi saya hanya menggunakan og:title, og:site dan og:url
dan untuk og:type saya tidak menggunakan, karena saya tidak mau halaman info pengguna yang mengklik button like di halaman blog saya dipenuhi oleh postingan saya. Khawatir nantinya tidak ada lagi yang mau mengklik button like di halaman blog saya. CMIIW
source

Get Shareaholic

Posted in: Social Netwoking, Web Development

About kakaeriel

kakaeriel a.k.a Ibnuh Hairil adalah seorang Web Programmer dan Web Design. Sangat menyukai sepak bola dan games, eksis dalam kegiatan-kegiatan sosial dan agama di wilayahnya, dan aktif di beberapa milis, komunitas dan jejaring sosial. ^^

Pengenalan dasar jQuery
Posted 03 . 03 . 2012 | 0 comments
Konfigurasi Codeigniter – (1) Autoload
Posted 07 . 20 . 2011 | 1 comment
Model View Controller Codeigniter
Posted 07 . 19 . 2011 | 1 comment
View Controller dan URL CodeIgniter
Posted 07 . 12 . 2011 | 5 comments
Facebook Killer Bernama Google+
Posted 07 . 07 . 2011 | 0 comments

14 Responses to Membuat Like Button Facebook di WordPress

EdwinJune 10, 2010 at 11:44

Mau tanya dong om. Kalo kita udah set like button di blog. trus cara kita pemilik blog memonitor siapa saja yang mengklik like button di artikel kita gimana ya?

Reply
hanifJuly 5, 2010 at 21:17

harus berbayar berarti ya bro?? kalo wp yg gratisan bisa ga?

Reply
- kakaerielJuly 13, 2010 at 02:56
  
  kalo wp gratisan kayaknya ga bisa deh bro, khan harus ngedit script wp-nya
  
  Reply
syahrulJuly 15, 2010 at 20:23

makasih .. tutorialnya lengkap banget, gak kayak blog lain yang cuma bisa copas saja sehingga penjelasannya kadang ndak jelas

Reply
- syahrulJuly 16, 2010 at 12:57
  
  setelah memasang kode tersebut,saya mencoba menggunakannya dengan membuka akun facebook dan kemudian mengklik icon like, tetapi yang muncul malah “kesalahan dalam opt:in” gimana cara perbaikinya ?
  
  Reply
- kakaerielJuly 16, 2010 at 20:06
  
  mungkin bisa di send email scriptnya gan
  
  Reply
pandapotan pardedeJuly 24, 2010 at 07:21

ada yang lebih praktis gak gan………….?

Reply
- kakaerielJuly 25, 2010 at 00:00
  
  belum ada gan, itu udah paling praktis
  
  Reply
Jack MardinJuly 27, 2010 at 23:29

Top Banget….Banget….Banget.Pokoke mantaflah :-D

Reply
rheinfulMarch 15, 2011 at 18:08

Nice share gan.

emmm tu sama ga dengan plug in addthis?

Reply
- kakaerielMarch 16, 2011 at 15:16
  
  setahu saya kalo addthis itu buat share, kalo button like itu salah satu apps facebook..
  
  Reply
ham-hamMay 25, 2011 at 15:47

wah.. ni dia yang q cari2…
thanks, gan..

Reply
hendragalusNovember 4, 2011 at 12:18

gan, kalo untuk wordpress.com gimana caranya?

Reply
- kakaerielNovember 4, 2011 at 17:32
  
  Pake plugins aja gan, coba SexyBookmarks (by Shareaholic)
  
  Reply