7:45 AM
0
Apa mungkin Facebook Comment bisa di buat responsive? Mungkin sekali, hanya dengan menambahkan beberapa kode seperti CSS, JQuery, dan JavaScript. Bagi yang sudah memasang kotak komentar facebook, tutorial ini cocok kamu terapkan di blog kamu yang sudah mendukung fitur responsive.

Apa itu komentar facebook responsive ?

Komentar facebook responsive adalah kotak komentar jejaring sosial facebook yang dibuat responsive. Hal ini di lakukan untuk mendukung bagi yang menggunakan template responsive. Responsive artinya lebar ukuran yang selalu menyesuaikan, lebar ukuran layar.
Script ini saya dapatkan dari blognya mkr-site.blogspot.com, ketika saya sedang mencari tutorial ini.
 Silahkan ikuti Tutorial berikut dengan teliti !!

1. Cari kode <div class='post-footer-line post-footer-line-3'><span class='post-location'> (gunakan CTRL+F untuk mempermudah mencarinya)
2. Jika tidak ketemu, cari kode post-footer-line post-footer-line-3 (cocokan kodenya dengan diatas sama tidak)
3. Copy paste kode Facebook Komen dibawah kode <div class='post-footer-line post-footer-line-3'><span class='post-location'>

Ini kode FB Komennya:
<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>

Lalu letakkan JavaScript 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>

Selesai..
Kode diatas akan bekerja jika kamu juga menggunakan template blogger responsive. Semoga artikel Cara Memasang Komentar Facebook Responsive di Blog ini mudah di pahami dan bermanfaat untuk teman-teman semua. Jika ada kesulitan silahkan tanyakan di kolom komentar. Terima kasih


0 comments:

Post a Comment