Memasang Kotak Komentar Facebook di Postingan Blog V2


Kotak komentar facebook di postingan blog sangat bagus diterapkan dalam postingan blog, ini berfungsi mirip dengan like dan share facebook. Pada postingan terdahulu saya sudah membuatkan tutorial tentang cara memasang komentar facebook di blog versi pertama. Memang ada kelemahan di sana yaitu, komentar facebook muncul di beranda, sehingga halaman homepage terlihat penuh, jika semakin banyak komentar dari pengguna facebook. (Mungkin karena kesalahan penempatan kode yang pernah saya lakukan.)

Pada artikel kali ini saya akan membuatkan tutorial bagaimana cara menambahkan kotak komentar facebook di postingan blog. Ya, kotak komentar ini hanya akan muncul di postingan blog dan komentar default blogspot bisa batasi / sembunyikan sebagian. Cara ini sedikit berbeda dengan yang pertama dan menurut saya agak rumit, karena kita harus membuat aplikasi sendiri di facebook. Namun saya yakin sobat blogger pasti bisa.

Untuk melihat live demonya silakan sobat buka disini dan   di sini,

Ada 4 langkah yang kita lalui dalam menerapkan ini. 
1. Menyembunyikan komentar asli / default blogspot. (Ini opsional bisa ya bisa tidak)
2. Membuat aplikasi komentar di facebook
3. Memasang aplikasi dan Menambahkan moderator meta tags di template blog.
4. Memasang kotak komentar facebook di edit HTML template

Oke saya kira langsung saja kita ikuti tutorialnya.  
Ingat, saya sarankan sobat mencobanya di blog percobaan dulu, baru sobat ulang lagi diblog yang sobat inginkan !!

A. Menyembunyikan komentar default blogspot (opsional)


Menyembunyikan komentar bawaan blog ini adalah pilihan bisa iya bisa tidak. Jika disembunyikan maka yang muncul cuma komentar facebook, sedangkan jika tidak maka yang muncul keduanya.

Masuk ke akun blogger > Dasbor > Setelan/Setting > Pos dan Komentar. Selengkapnya lihat gambar.
komentar facebook di posting blog


B. Membuat aplikasi komentar facebook

 

1. Pastikan sobat login di facebook kemudian masuk ke Facebook Developers Page
2. Klik Ke Aplikasi > Klik Create New App. Akan muncul seperti gambar di bawah. 


facebook box comments

     Isi nama aplikasi yang akan dibuat, akan muncul valid jika tersedia, klik lanjutkan
 
3. Setelah itu akan muncul Security Check Captcha, masukkan kode yang diminta pada form, kemudian kirim/submit

4. Setelah langkah di atas mungkin akan terjadi berulang kembali kita disuruh memasukkan ulang kode captcha, teliti ada opsi untuk konfirmasi lewat nomor telepon. (Langkah ini mungkin tidak selalu, karena saat saya mencoba lewat akun facebook yang lain tidak memerlukan proses ini.) Jika selesai langkah 3 bisa juga langsung muncul gambar berikut;


membuat memasang dan menambahkan komentar facebook di blogger

Simpan code App ID yang nantinya akan kita masukkan di meta tag template blog. Setelah itu isikan alamat blog kita, App Domain ketikkan blogspot.com jika kita masih memakai blogspot dan isi sesuai domain sendiri jika kita memakai domain sendiri, sesuai keterangan gambar di atas. Pada Website masukkan alamat url blog kita. Lalu save changes / simpan perubahan. 

C. Memasang aplikasi dan Moderator meta tag aplikasi di template blog.


Masuk akun blogger > Template > Edit HTML > Centang Expland Template Widgets. Masukkan kode di bawah di atas kode <b:skin><![CDATA[. Kemudian Save Template.




Masukkan nomor App ID yang didapat pada langkah B4 caranya ganti nomor unik facebook application ID dengan angka nomor ID

 D. Memasang Kotak komentar facebook di bawah posting blog.


1. Cari kode berikut di edit HTML template


Jika tidak ada cari kode

<p class='post-footer-line post-footer-line-3'>
atau kode

<data:post.body/>

Lalu masukkan kode di bawah ini, tepat di bawahnya kode diatas (pilih satu saja).




Silakan sesuaikan lebar '450' kotak komentar facebooknya.  Dan light menjadi dark jika template sobat gelap. Simpan template. dan kotak komentar facebook sobat sudah terpasang di postingan blog. Silakan buka salah satu postingan blog. Jika belum muncul silakan refresh / reload halaman posting tersebut. Demikian tutorial bagaimana cara membuat dan memasang komentar facebook di bawah postingan blog. Silakan di coba. 







Related Post:



70 komentar:

  2. mantap gan,,,berhsil..................

    ReplyDelete

  4. info bagus gan
    http://wartech-military.blogspot.com

    ReplyDelete

  5. ko gk bisa gan..pada saat save bagian
    pengisiian APP ID nya
    selalu di tolak save edit nya.

    ReplyDelete

  6. masukkan App Id yg didapat ke kode bagian C, ganti " Nomor Unik FACEBOOK_APPLICATION_ID " dengan nomor App Id yg diberikan, masukkan di template edit HTML. Simpan. silakan ulangi lagi.

    ReplyDelete

  7. Thanks Bro...mantap postingnya..aku udah berhasil nih..

    ReplyDelete

  9. tks infonya, gan! visit me juga yaa

    ReplyDelete

  10. Aduh, gan oq ga bisa ya.. g bs d parse pas d pratinjau.. aq cek lagi kyknya g da yg brubah... apanya yah

    ReplyDelete

  12. @ Damz and Ruli coba aja facebook commnet Versi 1 lebih mudah.

    http://blogbelajar2.blogspot.com/2012/02/memasangmembuat-komentar-facebook-di.html

    ReplyDelete

  15. Sangat Bagus kak.. saya akan coba :)

    ReplyDelete

  16. nggak bisa ,,,ada yang salah yaa ...

    ReplyDelete
  17. Replies

    1. nggak berhasil om.
      cari tutor yang lain ah..

      Delete

  22. makasih boss infonyaaa.. sangat berguna

    ReplyDelete

  25. Wah mantab banget nih baru berhasil haha :D

    ReplyDelete

  28. Gan Gimana Kalo Nga' Ada Di Tempale Saya

    Mohon Bantuan'a :D

    ReplyDelete

  29. wah friends tips ny SUPER HEBAR nice....
    mohon ijin coba nya y......

    klo mau lihat nich my blog
    http://poetra-pajaten-cheater.blogspot.com/

    ReplyDelete

  30. terimakasih banyak gan....

    tutorial ini sangat membantu..

    ReplyDelete

  31. Alhamdulillah thx saudaraku mantap hahahahaha

    ReplyDelete

  33. gagal bro...
    kode ada 3 bro di blog gw binggung gw milih yg mana

    ReplyDelete

  37. Nice Info, Sudah berhasil diterapkan pada Blog saya..
    Terimakasih, boss..
    Saya newbie di dunia Blogger, jd mohon bimbingannya..
    Silahkan kunjungi Blog saya di http://menginfo.blogspot.com/

    Thank You..

    ReplyDelete

  39. informasi yg bagus,,hasilnya jg bagus sob,,

    ReplyDelete

  40. izin compas aza gan n semoga agan di tambah ilmu nya tambah melimpah n Nice Info

    ReplyDelete

  41. Sukses mas bro di blog saya
    meskipun sedikit bingung
    terima kasih banyak

    ReplyDelete

  42. Oya lupa mas bro cara membuat facebook yg seperti punya sampeyan yg bila di klik close akan hilang sendiri gimana ya

    ReplyDelete

  43. @area infoku pake yg ini
    http://www.super-gaptek.com/2012/02/membuat-iklan-melayang-di-tengah-blog.html

    ReplyDelete

  45. mantap sob, bermanfaat banget.
    izin copas ya?

    jangan lupa kunjungi juga blog ku
    http://reza-solidaritas.blogspot.com/

    maaf sob jika blog saya kurang bagus. soalnya baru buat blog.jadi masih sedikit postingan nya .
    mohon di maklumi :)

    ReplyDelete

  46. gan kok ane plugin nya jadi bahasa planet

    cek http://dchacinx.blogspot.com

    itu kekmana gantinya

    ReplyDelete

  49. mampir ke blog ane ya boz, http://vandebuy.blogspot.com/

    ReplyDelete

  50. Berhasil dan Sukses'' Thnx gan..
    mampir juga ke blog saya
    http://www.yuzzindo.co.cc/

    ReplyDelete

  51. baru mau mencoba thanks lgsung ke TKP kujungi http://maddintercinta.blogspot.com

    ReplyDelete

  52. ini gmna cara krjanya gam,sya msih blum ngerti,maklum newbie

    ReplyDelete

  54. Kesalahan saat mengurai XML, baris 16, kolom 5: The value of attribute "property" associated with an element type "null" must not contain the '<' character

    malah keluar itu pas mau masukin ini code <meta content='105117652991202' property='

    knp yaa gan

    ReplyDelete

  55. My blog, ada yg kurang tambahin kode >>> fb:app_id'/>

    ReplyDelete

  57. mantab gan infonya,,,,,,,,,,,,,,,,langsung di sruput gan,he he
    kunjungan balike gan,http://watescyber.blogspot.com

    ReplyDelete

  58. sukses juga nambahin box komentarnya, thanks gan

    ReplyDelete

  59. annjritt dari beribu - ribu blogg... gua baru berhasill pake cara dari blogg keren ini ............

    mantaff bangett infonya ....

    emankk ni blog berkualitas .... gakkk salahhh gua nyasar ke blog ini ....

    makasiihh buat adminn... kerennn braa666

    nihh buktinya,........
    http://blacklinehardardware.blogspot.com

    liat kalo emak gak percaya ...
    thanks'ss

    ReplyDelete

  62. nice..
    berkunjung kesini ya:
    www.pratamapardiana.com

    ReplyDelete

  63. MANTAP gan,, ane berhasil.. yahoo
    Thanks Berat untuk agan yang telah memberikan ane solusi dari masalah ane selama ini :D
    happy blogging and semangat selalu memberikan tips-tips yang bagus dan menarik gan..

    kunjungi juga blog ane gan www.patentik.blogspot.com

    ReplyDelete

  64. biasanya pusing menerapkan solusi2blogger senior ni mah langsung ngacirrr............thanks gan!!!!

    ReplyDelete

  65. ada beberapa kode yang saya tidak temukan, cotohnya

    ReplyDelete

  66. terima kasih atas bantuannya
    saya sudah berhasil

    ReplyDelete

  67. gan itu FB commentnya bisa muncul asal comment box bawaan blogspot dicomment duluan ta?

    ReplyDelete
    Replies

    1. gak perlu gan. langsung nongol kok.

      Delete

Anda harus menjadi follower blog ini jika ingin memberikan komentar. Terima Kasih

Copyright © 2012 Blogger Super Gaptek. All rights reserved.| 2013 Templates

Super SEO created by Blogger Tuts | by