TUTORIAL :: Facebook Komen Dalam Blog

Assalamualaikum..
hari ni anis nak share tutorial pada korang

mengenai tajuk entry pada kali nih..

Ni anis buat atas pertanyaan sahabat anis iaitu

ZUHAIRI FIRDAUS

kalau nak tengok blog dia, klik link je.

Oke, mesti ade yang tak faham ape yang anis nak sampaikan kan.
So layan pic2 ni sebentar.

(ni komen untuk blogger)

(ni komen untuk facebookers)

So ada faham disini..

Meh ler mulekan dengan Bismillahirahmanirrahim...

1. LOGIN BLOG > DESIGN > EDIT HTML > TICK EXPAND WIDGET TEMPLATE

untuk langkaj keselamatan DOWNLOAD FULL TEMPLATES.

lagi..klik READ MORE

2. Tekan CTRL+F dan copy code PERTAMA di bawah ni.

<div class='comments' id='comments'> 

3. Kemudian pastekan code ini di bawah carian code PERTAMA..

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>

<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>

<fb:comments-count expr:href='data:post.url'/> Comments

</div>

<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>

<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments

</div><div class='clear'/>

</div>

<div class='comments-page' id='fb-comments-page'>

  <b:if cond='data:blog.pageType == &quot;item&quot;'>

   <div id='fb-root'/>

   <fb:comments expr:href='data:post.url' num_posts='2' width='400'/>

  </b:if>

 </div>

<div class='comments comments-page' id='blogger-comments-page'>

4. Tekan CTRL+C lagi dan cari code KEDUA

</head>

lepastu pada petak merah masukkan ID facebook anda.

Jap2..tahu tak FB ID tu macam mana??
Kalau anis, anis copy link facebook anis sebab anis dah change ID kepada SISHANUANIS.

(sila lihat petak merah di bawah)

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>

    <script src='http://code.jquery.com/jquery-latest.js'/>

    <meta content='YOUR FB ID HERE' property='fb:admins'/>

    <script type='text/javascript'>

    function commentToggle(selectTab) {

      $(".comments-tab").addClass("inactive-select-tab");

      $(selectTab).removeClass("inactive-select-tab");

      $(".comments-page").hide();

      $(selectTab + "-page").show();

    }

    </script>

Kemudian pastekan code di atas ni sebelum carian code 

KEDUA

5. Cari pula perkataan KETIGA /* Comment  

dan paste kan code kat bawah ni selepas carian KETIGA.

.comments-page {  background-color: #f2f2f2;}

#blogger-comments-page {  padding: 0px 5px;  display: none;}

.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}

.comments-tab-icon { height: 14px;  width: auto;  margin-right: 3px;}

.comments-tab:hover { background-color: #eeeeee;}

.inactive-select-tab { background-color: #d1d1d1;}

6. PREVIEW dulu baru SAVE..