Membuat Comment Box Facebook di website


posting kali ini saya akan posting bagaimana meletakkan kotak komment yang ada di Facebook ke website sobat. screenshotnya:

berikut step by stepnya:

1. sobat buat aplikasi dulu di facebook , klick link ini http://developers.facebook.com/plugins
2. setelah sobat buat app disitu maka sobat akan mendapat dua ID, App ID dan Rahasia aplikasi.

3. klick create new app di pojok kanan atas dan isi trs klik lanjutkan.

4. isi kode capchanya.. trs klick lanjutkan.

5. setelah itu selsai buat app-nya, sekarang kita setting tampilan comment boxnya, klick link berikut https://developers.facebook.com/docs/reference/plugins/comments/
isi pada form ini

klick get code nanti akan ada dua script yang akan sobat copas ke web sobat.

6. Copy script berikut diantara script <head> dan </head>
<meta property=”fb:app_id” content=”App ID sobat” />
<meta property=”fb:admins” content=”Aplikasi Rahasia sobat” />

<div id=”fb-root”></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/id_ID/all.js#xfbml=1&appId=App ID sobat”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>

7. trus copikan script diatas, berikut: dimana sobat akan menampilkan comment box trsbt.
<!– “Facebook code” Start –>
<div id=”fb-root”></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/en_US/all.js#xfbml=1”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>

<!– “Facebook code” End –>
<!– Facebook Asynchronous SDK Loader –>
<div id=”fb-root”></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: ‘App ID sobat’, status: true, cookie: true, xfbml: true});
};

(function() {
var e = document.createElement(‘script’); e.async = true;
e.src = document.location.protocol +
‘//connect.facebook.net/en_US/all.js’;

document.getElementById(‘fb-root’).appendChild(e);
}());
</script>
<div data-href=”http://handexcel.site40.net/&#8221; data-num-posts=”2″ data-width=”750″></div>
</div>

selesai Demonya bisa dilihat di [DEMO]

semoga bermanfaat😀

5 Comments Add yours

  1. aank budi santoso mengatakan:

    ngono yo iso boz

    1. informatika11d mengatakan:

      sama”.. thanks juga dah mampir

  2. kalo untuk website bagaimana yah buat box komentar fb nya??

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s