Pasang Facebook Comments Versi Responsive

By : Posted on 03/11/2014 - 2:27 pm with 2 comments

Responsive Comments

Pasang Facebook Comments Versi Responsive ye? Okay di sini aku akan terangkan beberapa langkah mudah untuk pasang facebook comments untuk blogspot.

Agak lama tidak buatkan entri tutorial ini. Idea ini terlintas ketika tengah sibuk mengedit beberapa blog untuk pasang facebook comments.

Facebook Comment ini adalah responsif.

Apa yang di maksudkan dengan responsif ? Responsive bermaksud dapat menyesuaikan skala saiznya mengikut browser atau gajet tertentu.

Jika anda melayari menggunakan smartphone,secara automatiknya skala saiz pada FB comments ini akan berubah bentuk mengikut saiz smartphone anda.

Baca ini : Apa itu Responsif Ye??

Sebenarnya apa kelebihan pasang facebook comments ini?

Kelebihan
  • Ramai pengguna internet mempunyai akaun facebook berbanding google.
  • Meningkatkan traffik blog anda. (Ye ker??)
Eh! Macam mana boleh tingkatkan traffik? Apa kaitannya dengan facebook comments ini ?

Sebenarnya setiap komen yang diberi, secara tidak langsung entri anda turut di kongsi di laman sosial facebook.

Andai kata 10 komen anda dapat, maka 10 kali entri anda dikongsi. Bila di kongsi di facebook, kebarangkalian untuk entri anda untuk terima traffik agak cerah. Itulah kelebihannya.

Okay dah cerita panjang mengenai facebook comments ini. Ikutilah langkah mudah yang untuk pasang facebook comments ini.

Facebook Comments Responsive For Blogspot

Seperti biasa:

Langkah 1:
Log in dashboard > design > HTML  (Jangan Lupa Backup Dulu Template)

Langkah 2:
Pasang kod ini di bawah <head>

<meta content='FB Profile ID' property='fb:admins'/>
<meta content='App ID' property='fb:app_id'/>


Langkah 3:
Letakkan kod di bawah ini di atas kod <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>


Langkah 4:
Pasang kod HTML di bawah  <data:post.body/> . Selalunya kod ini ada lebih dari satu. Cari kod yang terakhir atau anda boleh cuba satu persatu.

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


Langkah 5:
Save template anda. Selesai.

 Okay semoga berjaya pasang facebook comments ini.

2 comments

Click here for comments

alhamdulillah jdi pn.. hehe.. trime kasih.. =)
visit my blog komalaysia.blogspot.com

tahniah ye. InsyaAllah saya akan jenguk blog anda. :)

1. Gunakan Name/URL untuk komen jika tidak mempunyai akaun Google+.
2. Elakkan Guna Anonymous untuk mengelakkan kekeliruan.
3. Komen anda akan ditapis dahulu sebelum diterbitkan.
4. Terima kasih kepada yang memberi komen.