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.
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">Copy & Paste Javascriptnya, di atas kode </head>
//<![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>
Kode FB Komennya seperti ini:
<b:if cond="data:blog.pageType == "item"">
<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