Cara Pasang Komentar Facebook di Blog 100% Work - Kali ini saya akan berbagi tentang bagaimana cara memamsang komentar Facebook di blog 100% responsive. Mengapa dijudulnya saya tambahkan kata-kata Responsive dan 100% Work? Berikut ulasannya.
Dari bebrapa kasus yang pernah saya temui. Tidak semua komentar Facebook yang terpasang di blog itu responsive.
Ada kasus dimana komentar Facebook yang disandingkan dengan komentar default Blogger secara visual kurang enak dipandang.
Ada juga kasus dimana komentar Facebook di blog hanya responsive untuk versi Desktop saja, sedangkan jika ingin berkomentar di blog dengan komentar Facebook versi mobilenya, komentar Facebook tersebut hilang-hilang timbul gak jelas sehingga kesulitan dan tidak bisa untuk berkomentar.
Untuk lebih jelasnya perhatikan gambar dibawah ini:
1. Komentar Facebook dan komentar default Blogger dapat tampil secara berdampingan dengan sempurna
 |
| Komentar Facebok yang Responsive |
2. Kehadiran komentar Facebook seolah mengusik komentar default Blogger dan iconnyapun tidak bisa tampil. Tentu ini kurang sedap dipandang.
 |
| Komentar Facebook Kurang Enak Dilihat |
Dua kasus diatas berdasarkan pengalaman saya sendiri. Dan karena itu, saya menemukan satu cara ampuh untuk memasang komentar Facebook di blog yang responsive baik di versi Desktop maupun tampilan mobile. Dan cara ini sudah saya buktikan sendiri.
Ikuti langkah-langkah berikut ini untuk memasang Komentar Facebook Responsive di Blog 100% Work.
1. Yang pertama yang harus anda lakukan adalah memasang Meta Facebook pada template blog terlebih dahulu. Caranya mudah, tempatkan kode dibawah ini tepat dibawah kode <head>
<meta content='xxxx' property='fb:admins'/>Ganti xxxx dengan FB admin ID dan App ID anda sendiri.
<meta content='xxxx' property='fb:app_id'/>
Baca juga :
2. Setelah itu copy kode dibawah ini kemudian pastekan dibawah kode <body>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
3. Selanjutnya copy kode dibawah ini kemudian pastekan dibawah kode <div class='comments' id='comments'>
<b:if cond='data:blog.pageType == "item"'>4. Simpan template dan pastikan tidak ada yang error. Jika terdapat kesalahan coba cek ulang apakah sudah benar anda mengikuti langkah-langkah diatas.
<div style='margin-top:20px'>
<div class='fb-comments' data-num-posts='5' data-width='600' expr:data-href='data:blog.url'/>
</div>
</b:if>
Cara ini sudah saya buktikan sendiri. Sekarang giliran anda.
Coba buka salah satu postingan blog. Dan perhatikan komentar Facebooknya responsive atau tidak. Buka melalui Desktop dan mobile. Jika ada kendala diskusikan di komentar ya!
EmoticonEmoticon