Rabu, 19 Februari 2014

Cara Memasang Komentar Facebook Responsif

Facebook Comments
Cara Memasang Komentar Facebook Responsif ~ Salam blogger semuanya. Mungkin sobat pernah melihat blog yang ada komentar facebooknya bukan, komentar facebook ini sangat berguna untuk pengunjung jika ingin mengomentari artikel blog anda, dan hampir semua orang bisa berkomentar, karena pengguna facebook ini sangat banyak sekali. Namun komentar facebook ini belum responsif nah pada kali ini saya akan membagikan tutorial "Cara Memasang Komentar Facebook Responsif", sebagai contohnya anda bisa lihat diblog ini. 
Oke langsung saja ketutorialnya:
- Masuk ke blogger >> Template >> Edit HTML
- Cari kode <head> lalu simpan kode dibawah ini tepat dibawahnya:
<b:if cond='data:blog.pageType == &quot;item&quot;'><meta content='arif.rachmanhakim4' property='fb:admins'/></b:if>
Ganti kode yang berwarna biru dengan username facebook anda,
contoh: - https://www.facebook.com/arif.rachmanhakim4
yang biru itu username facebook anda.
Meta tag diatas berguna agar anda bisa memoderasi komentar yang masuk.
- Cari kode </body> (ctrl + f untuk memudahkan mencarinya) lalu simpan kode dibawah ini tepat diatasnya:
<script type='text/javascript'>//<![CDATA[$(window).bind("load resize", function(){  var url = location.protocol+'//'+location.host+location.pathname;   var containercm_width = $('#container-commentfb').width();       $('#container-commentfb').html('<div class="fb-comments" ' +    'data-href="'+url+'"' +    ' width="' + containercm_width + '" data-num-posts="10"></div>');    FB.XFBML.parse( );   });//]]></script>
 - Cari kode <div class='post-footer-line post-footer-line-3'/> lalu simpan kode dibawah ini tepat dibawahnya:
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/><script async='async' src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>  <div id='container-commentfb' style='width: 100%;height:auto;margin-top:30px;'><fb:comments expr:href='data:post.url' num_posts='5' width='500'/></div></b:if>
Lalu Simpan template, taraa, sudah jadi dan silakan dichek responsifnya.
Selamat mencoba semoga berhasil.

Comments Blog

comments powered by Disqus