/ / Cara Membuat Facebook Comment Responsive di Blog

Cara Membuat Facebook Comment Responsive di Blog

November 25, 2015
Cara membuat facebook comment responsive atau cara memasang komentar facebook responsive di blog. Komentar facebook responsive sama halnya dengan yg ada pada blogger. Bedanya adalah setiap ada komentar akan langsung ditampilkan di halaman fanspage.


Bagi yg ingin memasang komentar facebook responsive di blog, simak langkah-langkah dibawah ini.

Meta Tag Komentar Facebook
  • Login ke akun blogger.
  • Kemudian klik menu template.
  • Klik edit html.
  • Pastekan kode berikut dibawah kode <head>
<meta content='Kode ID Admin Facebook' property='fb:admins'/>
<meta content='Kode ID Aplikasi Facebook' property='fb:app_id'/>
Script Komentar Facebook Responsive
  • Login ke akun blogger.
  • Kemudian klik menu template.
  • Klik edit html.
  • Pastekan kode berikut diatas kode </head>
<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>
HTML Komentar Facebook
  • Login ke akun blogger.
  • Kemudian klik menu template.
  • Klik edit html.
  • Pastekan kode berikut diatas kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div id='container-commentfb' style='width: 100%;'><fb:comments expr:href='data:post.url' num_posts='10' width='650'/></div>
</b:if>
  • Klik simpan template

Keterangan
Tulisan warna merah adalah jumlah komentar yang muncul. 
Tulisan warna biru lebar kotak komentar. Sesuaikan dengan lebar halaman posting anda. 
Semoga berhasil.


Tampilkan Komentar