Blog Deiza

Blog Game Aplikasi dan Juga Internet

Cara Mudah Memasang Komentar Facebook Responsive di Blog

Blog Deiza - Cara Mudah Memasang Komentar Facebook Responsive di Blog, Apa mungkin Facebook Comment bisa dibuat responsive? Jawabnya Mungkin sekali, hanya dgn menambahkan beberapa kode seperti CSS, JQuery, & JavaScript. Bagi yg sudah memasang kotak komentar facebook, tutorial ini cocok loe terapkan diblog loe yang sudah mendukung fitur responsive.

Apa itu komentar facebook responsive ?

Komentar facebook responsive adalah kotak komentar jejaring sosial facebook yg dibuat responsive. Hal ini dilakukan utk mendukung bagi yg menggunakan template responsive. Responsive artinya lebar ukuran yg selalu menyesuaikan, lebar ukuran layar.

Script ini gue dapatkan dari blognya mkr-site.blogspot.com, ketika gue sedang mencari tutorial ini.

Cara Memasang Komentar Facebook Responsive di Blog

Berikut cara memasang/membuat komentar facebook menjadi responsive:

Untuk teman-teman yg belum tahu cara memasangnya bisa membaca diartikel gue yg berjudul Cara Memasang Kotak Komentar Facebook.

Yg perlu loe lakukan adalah menambahkan kode javascript ini:
<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>
Copy & Paste Javascriptnya, di atas kode </head>

Kode FB Komennya seperti ini:
<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>

Keterangan:

  • Yg berwarna merah adalah kode FB komen asli
  • Yg berwarna biru adalah kode javascript untuk merubahnya menjadi responsive
  • Yg berwarna hijau adalah kode tambahan untuk merubahnya menjadi responsive
Jika bingung, hapus semua kode facebook komen yg ada diblog loe, lalu diganti dgn kode yg sudah gue berikan diatas.

Kode diatas akan bekerja jika loe juga menggunakan template blogger responsive. Semoga artikel Cara Memasang Komentar Facebook Responsive di Blog ini mudah dipahami & bermanfaat untuk teman-teman semua. Jika ada kesulitan silahkan tanyakan dikolom komentar. Terima kasih
Bagikan :
+
Previous
Next Post »
 
Copyright © 2015 Blog Deiza - All Rights Reserved
Template By Kunci Dunia
Back To Top