Home › Tutorial › Memasang Kotak Komentar Facebook + Notifikasi

Memasang Kotak Komentar Facebook + Notifikasi

Memasang Kotak Komentar Facebook + Notifikasi, ini merupakan cara baru penerapan komentar facebook pada blog yang setiap ada komentar pada blog kita, akan otomatis muncul notifikasi langsung ke facebook admin, jadi membuat kita update dan membaca setiap komentar para visitor kita. langsung saja ke tutorialnya.

Step 1. Disable/nonatifkan komentar default blog

Kenapa ? karena nanti tampilan blogmu akan rancu kalau ada 2 kotak komentar.
Cara Disable : Buka Akun blogger → setting → comments → Pilih "Hide" → Save Setting.

Step 2. Membuat aplikasi facebook untuk komentar blog

Masuk ke link Facebook Developers → Buat Aplikasi → Masukkan Nama Aplikasi (terserah anda) → tandai "SETUJU" → klik "Create Application"
Nah aplikasi selesai, tinggal kita konekin ke blog kita, masuk ke tab "Situs Web" lihat gambar
Klik Untuk Memperbesar
Setelah itu klik "Simpan Perubahan"
KLIK UNTUK MEMPERBESAR GAMBAR
Nah, kita sudah dapatkan ID aplikasinya, kita lanjut lagi ke blogger

Step 3. Memasukkan Kode Ke Template Blog

Masuk ke akun blogger → Layout → Edit HTML → Expand Widget Template
cari kode ini  <html
Kalu sudah ketemu, tambahkan kode dibawah ini 
xmlns:fb='http://www.facebook.com/2008/fbml'
Harus ada Spasi diantara kode tersebut, ini contohnya
<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog......2005/gml/expr' >
Langkah selanjutnya, Cari kode <body>
Setelah kode atau dibawah kode diatas masukkan script dibawah ini
<div id="fb-root"></div>
<script>
    window.fbAsyncInit = function() {
    FB.init({
      appId  : 'ID Aplikasi Anda',
      status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the   session
      xfbml  : true  // parse XFBML
    });
  };

    (function() {
    var e = document.createElement('script');
      e.src = document.location.protocol +   '//connect.facebook.net/en_US/all.js';
    e.async = true;
      document.getElementById('fb-root').appendChild(e);
    }());
</script>
Selanjutnya, Memasang Open Graph Protocol Tags
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='NAMA BLOG ANDA' property='og:site_name'/>
<meta content='URL LOGO BLOG ANDA.gif'   property='og:image'/>
<meta content='ID APLIKASI ANDA'   property='fb:app_id'/>
<meta content='ID FACEBOOK ANDA'   property='fb:admins'/>
<meta content='article'   property='og:type'/>
Sesuaikan Tulisan yang berwarna merah diatas dengan blog anda dan facebook anda
setelah merubah/mengedit script diatas, cari kode </head>, lalu simpan script diatas sebelum tag tersebut atau diatasnya.

Step 4. Menambahkan kotak komentar facebook.

cari kode <data:post.body/> kemudian masukkan script dibawah ini kebawah kode tersebut. 
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div><fb:comments width='450' expr:title='data:post.title' expr:href='data:post.url' colorscheme='dark' expr:xid='data:post.id'/></div>
<div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'> <img alt='om-dayz.blogspot.com' class='icon-action' height='16' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvhtwmdlReao69LUyfTbnTzowd_5tUkQwvOqlu4qlIm83dtn9eFsWDZCkaq1c8151DMgReJ_PERnMEjMLr5dFOMMokruKNREwQNiBvoD7-h6EMY74v8BUrqDNud6YNfsTjegyr5cqWpOE/s1600/logo2.gif' width='16'/> <b><a href='http://www.om-dayz.blogspot.com/' target='_blank' title='blogger templates, blogger tutorials, om-dayz'>Om-Dayz Comments For Blogger</a>  Mau Pasang Kotak Kmentar Facebook Seperti Ini ? Klik Link ini !<a href='http://om-dayz.blogspot.com/2011/10/memasang-kotak-komentar-facebook.html'>Om-Dayz Facebook Comment Tutorial</a></b></div>
</b:if>

Tulisan yang berwarna merah edit sesuai dengan blog anda, Untuk Colorscheme hanya ada 2 pilihan warna, yaitu Dark dan Light!

Silahkan dicoba, saya sendiri sudah menerapkan kotak komentar facebook ini di blog saya yang lama http://lorddayz.blogspot.com dan berhasil.
Selamat Mengoprek :))
Bagikan ke Teman ›
om-dayz lintasme
om-dayz facebook share
om-dayz Tweet Button
om-dayz digg Submitter
Kategori @ , ,

44 komentar Untuk Memasang Kotak Komentar Facebook + Notifikasi

  1. Musa Khairul Umam1 Oktober 2011 pukul 15.33

    Pertamaxx,tapi nih tutornya bisa blog jadi berat gk om ?

    BalasHapus
  2. Impotensia1 Oktober 2011 pukul 15.36

    silahkan kesini sob http://lorddayz.blogspot.com
    nilai sendiri deh :)
    buka postingannya :)

    enjoy it ^^

    BalasHapus
  3. Musa Khairul Umam1 Oktober 2011 pukul 15.43

    Wah kalo menurut ku sih lumayan,soalnya beratnya di campur ama background2 di blog itu

    BalasHapus
  4. Impotensia1 Oktober 2011 pukul 15.54

    hehehehe,, itu tergantung koneksi dan tampilan blog itu sendiri :D

    BalasHapus
  5. Naughtyric1 Oktober 2011 pukul 16.51

    sip om trik nya bisa dicoba nih,
    makasih banyak terus update om :v

    BalasHapus
  6. Farixsantips1 Oktober 2011 pukul 17.39

    Kurasa akan lebih nikmat dengan kotak komen yang SEO Friendly (menurut saya :) ) kalau Facebook mungkin dipasang sekunder atau tidak pokoklah, dan Comment facebook tidak terlihat dimata Google

    BalasHapus
  7. Impotensia1 Oktober 2011 pukul 17.42

    @Nauhtyric
    silahken :v

    @Farixantips
    iyaa sob,,betul tuh,, hhee
    lebih banyak komentar juga klo make Kotak komentar bawaan blog :D

    BalasHapus
  8. Unknown1 Oktober 2011 pukul 22.36

    Gagal Pertamax Deh YAng Pntng FourTHumbsUp

    BalasHapus
  9. Rama Saputra Zylgwyne2 Oktober 2011 pukul 11.35

    wahh eksis lagi nih om,, mulai posting tutorial lagi ,, :v.. tutorial cara bikin domain dong om,, biar ane gak kebakaran jenggot lagi,, wkwkkwkw,,

    BalasHapus
  10. Impotensia2 Oktober 2011 pukul 11.44

    @Rieco
    thx :D

    @RamaEightEight
    wwkwkwkwk,, hadeh,, saya lagi ol nih,, koq gk ol lu cuy ?
    daritadi we tungguin =="

    BalasHapus
  11. Majalah Masjid Kita2 Oktober 2011 pukul 11.46

    jadi lebih mudah termonitor ya mas.. hebat :)

    BalasHapus
  12. Impotensia2 Oktober 2011 pukul 11.49

    @Majalah Masjid Kita

    iyaa masbro :)
    notifikasi masuk langsung ke facebook admin :)

    BalasHapus
  13. apakah ini itu2 Oktober 2011 pukul 14.35

    ane pernah make, tapi jadi berat banget blognya. ada gak ya yang versi entengnya

    BalasHapus
  14. ip-ip2 Oktober 2011 pukul 15.15

    kalo aku sih pake WP jadi tinggal install pluginnya wae..
    tapi keren ni tutorialnya,,sangat bermanfaat..

    BalasHapus
  15. Impotensia2 Oktober 2011 pukul 15.24

    @Apakah ini itu
    hhee,, msa sih mas ?
    blog aku make itu ringan ttep koq
    :)

    @ip-ip
    hhee,,mantep neh make WP
    tinggal install plugin
    sukses trus blognya mas :)

    BalasHapus
  16. Rezkiji2 Oktober 2011 pukul 16.16

    udah pernah coba di blog saya yang satunya
    cmn ijin nyimak aja :)

    BalasHapus
  17. Impotensia3 Oktober 2011 pukul 00.07

    @Rezki
    hhee iyaa masbro,, makasih kunjungannya :)

    BalasHapus
  18. Prapatan Kertek3 Oktober 2011 pukul 14.08

    Meskipun sedikit ribet namun tutor ini sangat bermanfaat utk promosi blog.
    Happy bloggig..!!

    BalasHapus
  19. Impotensia3 Oktober 2011 pukul 20.18

    @Prapatak Kretek
    hhee,, iya mas,, enjoy it :)

    BalasHapus
  20. thedexwan5 Oktober 2011 pukul 23.59

    uda ane coba gan tpi klo ada yg komeng ga ada pemberitahuan nya sama kita :D

    BalasHapus
  21. Impotensia6 Oktober 2011 pukul 12.17

    jiah =))
    msa sih ?
    wkwkwkw
    ada yg salah langkah ato salah ngisi kali
    saya juga pakai itu koq di blog http://lorddayz.blogspot.com
    dan setiap ada yg koment masuk ke pemberitahuan :)

    BalasHapus
  22. TEDI SUNJAYA7 Oktober 2011 pukul 20.34

    Saya dah follove om-dayz
    folback yak di http://tedisunjaya.blogspot.com

    salam kemahoan :v

    BalasHapus
  23. Unknown7 Oktober 2011 pukul 23.12

    Saya dah follove om-dayz
    folback yak di http://tedisunjaya.blogspot.com

    salam kemahoan :v :ngkak ah

    Slam maho om dayz :ngacir ke sono >............http://om-rieco.blogspot.com/

    BalasHapus
  24. Impotensia8 Oktober 2011 pukul 08.09

    @Teddy & Rico
    ococ,, segera meluncur ke TKP =))

    BalasHapus
  25. Rumah Dijual13 Oktober 2011 pukul 16.26

    info yang bagus tw,,, :)

    BalasHapus
  26. Impotensia14 Oktober 2011 pukul 18.40

    @Rumah Dijual
    iyaa sob,, sama2 :)
    sering2 berkunjung ya :D

    BalasHapus
  27. ./Riedho-Cbs6 November 2011 pukul 23.39

    ijin sedot om :)

    BalasHapus
  28. Pe-Ha-Ka6 November 2011 pukul 23.59

    mantap kk :* aku mau dong di pajang blog ku di blog kk :* biar terkenal :*

    BalasHapus
  29. Obat Herbal Asam Urat22 Desember 2011 pukul 10.45

    menarik banget .
    harus langsung ke tkp nih

    BalasHapus
  30. Obat Alami Asam Urat22 Desember 2011 pukul 10.47

    thanks buat infonya .
    postingan yang menarik .
    ditunggu postingan menarik lainnya

    BalasHapus
  31. Hadhara25 Februari 2012 pukul 15.12

    informasi yang bagus kawan, kebetulan saya lagi mencari tutorial tentang ini, tapi apakah komentar ini diarahkan ke masing-masing postng ya..? gak untuk semua post.. makash

    BalasHapus
  32. owie8 April 2012 pukul 18.12

    like this blog..
    kunjung balik blog saya gan :)

    BalasHapus
  33. Ahmad Muhibullah10 April 2012 pukul 16.57

    thanks ... artikelnya

    BalasHapus
  34. Diana Yunita Kusumawati10 Mei 2012 pukul 14.28

    mas maap nanya maklum ibu2 rt yg gaptek tp brusaha exis hhhh...hhhh...abis create application simpan trus masuk "situs web"? yg mana maaf gag ngerti di blog saya ato pd facebook...trimaksh semoga Allah membalas kebaikannya ya....amin

    BalasHapus
  35. Unknown7 Juli 2012 pukul 00.45

    cara mengetahui komentar facebook yang masuk gimana ????

    BalasHapus
  36. blog remaja9 Juli 2012 pukul 10.47

    keren banget tutorialnya.., oiya kok facebook saya gak ada notifikasinya yah

    BalasHapus
  37. Obat Thalasemia Tradisional12 Juli 2012 pukul 16.51

    cuman bsa bilang makasih aja dah gan . .

    BalasHapus
  38. Cara Membesarkan4 Agustus 2012 pukul 11.07

    tulisan yang menarik, makasih atas ilmu yang anda tulis di sini,

    BalasHapus
  39. himatika16 Agustus 2012 pukul 23.52

    Thq gan info nya ... jadi cukup da pencerahan nehhh

    BalasHapus
  40. Feby yohandra15 November 2012 pukul 14.35

    Mkasi Infonya sob . . .
    berguna bgt buat Blog Newbie seperti ane . . . ^_^

    Visit --> http://IT-cybererror.blogspot.com

    BalasHapus
  41. Unknown17 Agustus 2013 pukul 00.01

    kunjungan malam sob http://cyberbintauna.blogspot.com

    BalasHapus
  42. Akumaru23 Oktober 2013 pukul 18.37

    Terimakasih untuk tutorialnya, saya coba dulu

    BalasHapus
  43. KerjaIdola26 November 2013 pukul 19.33

    Saya pake app ini... Namun sayangnya Komentarnya gak bisa dimoderasi atau gak muncul diNotifikasi facebook kita, cuman anehnya diblog satunya bisa muncul... Btw ada setiingan selain ditutorial ini?

    BalasHapus
  44. Star Valley19 Juli 2018 pukul 13.31

    stardew valley mods for free download full version

    BalasHapus

Follow Me On Twitter Facebook Fanspage Circle Me On Google Plus Subscribe to RSS Feed