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