Cara Pasang Komentar Facebook di Blog (New Version) | Ariyo Web

Cara Pasang Komentar Facebook di Blog (New Version)


Akhirnya artikel yang sangat ditunggu-tunggu dii Publish juga, ini adalah fitur yang paling ditunggu untuk pengguna blogger, dalam langkah-langkah sangat mudah untuk meng-integrasi kotak komentar facebook dan blogger (blogspot).

Sekarang pengunjung tidak perlu ketik alamat email mereka atau nama untuk memberikan komentar di situs anda. Mereka hanya login ke account facebook mereka secara otomatis sudah bisa komentar .
Semua orang terhubung melalui facebook , hal ini akan mendorong lebih banyak orang untuk komentar karena kebanyakan orang sudah log in ke account mereka.

Nah saya akan memberikan tutorial kolom komentar Facebook yang versi ke-III beserta tombol like dan sharenya, kolom komentar facebook ini lebih sempurna karena ada fitur reply dan notifikasi, jadi kita bisa tahu kalau ada yang berkomentar menggunakan komentar facebook karena ada pemberitahuan di akun facebook kita, jadi kita bisa me-manage komentar tersebut . Tuh diatas udah ada gambarnya. Oke deh cukup untuk kata sambutannya, sekarang kita langsung saja.

Cara Pasang Kotak Komentar Facebook di Blogger

Langkah 1. Nonaktifkan Default Komentar.

Hal pertama yang harus anda lakukan yaitui Non-aktifkan setting komentar andda, karena anda tidak ingin memiliki 2 bentuk komentar, dan jika memang membutuhkan dua komentar biarkan saja seperti biasa.

Silahkan ke Account blogger anda.
Navigasikan ke Pengaturan lalu klik Komentar  Pada menu Komentar klik Sembunyikan kemudian klik  SIMPAN .

Langkah 2. Buatlah Facebook App ID ( Aplikasi di Facebook ).

Sekarang anda harus menghasilkan facebook App ID Anda sendiri, itu benar-benar mudah dan prosesnya hanya satu langkah, login dulu dengan account Facebook anda lalu silahkan kunjungi, pengembang facebook disini :  Facebook developers

Anda akan diwa ke halaman seperti Contoh pada Gambar dibawah :

Masukkan nama aplikasi Anda, (Anda dapat mengetikkan nama apa saja) dan klik Aggre lalu klik Create Application. Anda akan dibawa menuju verification Security Check, isi Chaptcha dengan benar. Anda akan dibawa kehalaman seperti gambar dibawah ini :

Kemudian anda klik tab Web Site , maka akan nampak gambar seperti dibawah ini :


Masukkan Site URL anda, ketik domain anda mis : http://www.ariyo.web.id/
Kemudian isi Site Domain anda. Jika anda memakai domain blogspot, gunakan blogspot.com .Kemudian SAVE CHANGES.
Catatan : Untuk tanda "/" diakhiran domain pada Site URL anda hukumnya WAJIB.
Langkah 3. Menambahkan Kode pada template blogger
Anda harus menambahkan kode berikut ke template blogger anda, untuk memastikan bahwa kotak komentar akan bekerja pada blog anda dengan cara yang benar. Silahkan account blogger anda kembali, arahkan ke RANCANGAN + EDIT HTML, lalu check EXPAND TEMPLATE WIDGET. Jangan lupa Download Template Anda atau Copy lalu pindahkan di Notepad untuk menjaga jika terjadi kesalahan nantinya. Untuk Mempermudah dalam pencarian kode Tekan Ctrl + F.
Cari :
<body>
Kemudian, tambahkan kode berikut dibawahnya :
<div id='fb-root'/>
<script>
  window.fbAsyncInit = function() {
  FB.init({
  appId : &#39;APP-ID Anda &#39;,
  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(&#39;script&#39;);
  e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js&#39;;
  e.async = true;
  document.getElementById(&#39;fb-root&#39;).appendChild(e);
  }());
  </script>
Ganti APP-ID anda dengan APP-ID aplikasi Facebook yang anda buat tadi.
Lalu cari lagi
<data:post.body/> 
Pasang kode berikut dibawahnya, Jika <data:post.body/> punya dua karena sudah pasang Readmore maka pasang kode tersebut di <data:post.body/> yang kedua.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p align='left'><span class='Apple-style-span' style='color: #444444; font-family: Verdana, sans-serif; font-size: x-large;'><b>Kolom Komentar</b><br/></span></p>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#appId=APP ID&amp;xfbml=1'/><fb:like expr:href='data:post.url' font='arial' send='true' show_faces='true' width='450'/>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#appId=APP ID&amp;xfbml=1'/><fb:comments expr:href='data:post.url' numposts='5' width='600'/>
</b:if>    
Ganti APP-ID anda dengan APP-ID aplikasi Facebook yang anda buat tadi.
Lalu cari lagi
<head>
Pasang kode berikut dibawahnya :
<meta content='ID FACEBOOK' property='fb:admins'/>
<meta content='APP ID' property='fb:app_id'/> 
Untuk ID FACEBOOK ganti dengan ID Facebook anda mis : http://facebook.com/ariyo.darmadi
Setelah itu Save Template.
Sekian tutorial dari saya, semoga anda dapat terbantu. Untuk kekuranganya saya mohon maaf, saya juga baru belajar.
Good Luck sahabat ^_^

Related Post

Kolom Komentar

Delete this element to display blogger navbar

 
© Ariyo Web | Design by Blog template in collaboration with Concert Tickets, and Menopause symptoms
Powered by Blogger