Cara Membuat dan Memasang komentar Facebook Responsive Di Blog

Selamat pagi dan selamat datang di blog sederhana saya..  kali ini saya akan berbagi tips cara membuat dan memsang komentar facebook responsive di blog , Komentar facebook juga tidak kalah penting dari komentar default blog., karena jika pengunjung sedang login facebook maka pengunjung tersebut bisa langsung bekomentar lewat kolom komentar facebook.

Saya punya dua cara memasang komentar facebook responsive dan non responsive., tapi saya lebih suka yang responsive karena bisa menyesuaikan tampilan komentar sesuai lebar dari template yang di pakai.






Yang pertama akan saya kasih adalah kotak komentar facebook yang biasa atau bukan responsive.

1. Login ke akun blogger sobat
2. Masuk dashboar > Template > Edit HTML
3. Cari Kode <data:post.body/> dan letakan kode di bawah ini tepat di bawah <data:post.body/>
       
 NOTE: Ada beberapa kode <data:post.body/> biasanya yang no 2. tapi coba saja satu-satu

 <div class='clear'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><div><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' num_posts='1'/></div>

Kemudian Save dan lihat.


Yang kedua saya akan kasih tips kotak komentar facebook yang responsive

1. Masuk akun blogger sobat
2. Masuk dashboar > Template > Edit HTML
3. Cari Kode <data:post.body/> dan letakan kode di bawah ini tepat di bawah <data:post.body/>

KETERANGAN: masih sama seperti di atas 

<b:if cond="data:blog.pageType == &quot;item&quot;">
<h4>Post Comment</h4>
<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='5' width='500'/></div>
</b:if>


Kemudian cari kode </head> dan letakan kode di bawah ini tepat 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>


Kemudian save, dan lihat hasilnya..  Semoga tips saya bermanfaat terimakasih. 

KOMENTAR DISINI

ARTIKEL TERBARU: