Cara Memasang Komentar Facebook Responsive di Blog


Cara memasang komentar facebook responsive di blog - pada pagi ini saya kembali memberikan tutorial cara memasang komentar facebook di blog, pasti udah banyak yang tau kan kalau komentar facebook bisa di letakkan pada blog, tutorial nya pun sudah banyak blogger blogger lain yang share, kali ini beda, komentar facebook nya kita bikin lebih responsive, biarpun cuma beda di responsive nya saja sih

Langsung saja kita terapkan pada blog

Cara memasang nya

1. Login ke blogger, tambahkan meta tag facebook ini di dalam template kamu, letakkan di bawah kode <head>

<meta content='Kode ID Facebook admin' property='fb:admins'/>
<meta content='Kode ID Aplikasi Facebook' property='fb:app_id'/>

Jika sudah di terapkan di template kamu, lewati saja

2. Tambahkan kode di bawah ini di atas 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>

3. Tambahkan kode di bawah ini tepat di bawah kode <data:post.body/> pada halaman post

<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>

4. Simpan template kamu

Tambahan

Untuk menampilkan jumlah komentar pada halaman index dan post, silahkan tambahkan kode di bawah ini pada markup post meta atau post info sesuai dengan template kamu

<a expr:href='data:post.url + &quot;#fb-comment&quot;'><span class="fb-comments-count" expr:data-href='data:post.url'></span> facebook comments</a>


Sekian tutorial kali ini, Semoga bermanfaat.

0 Comments

Posting Komentar

Ayo berkomentar sesuai dengan topik pembahasan.