» » Cara Pasang Kotak Komen Facebook Di Blog

Cara Pasang Kotak Komen Facebook Di Blog

Posted by MxDotMy | Media Terkini

Assalamualaikum salam 1 malaysia ok hari ni nak tunjuk sikit la tutorial cara nak pasang kotak komen facebook di blog korang ramai yang dah tau nie tapi  cara ni work lagi!!!

ok jom mula!



1. Dashboard > Design > Edit Html > Tick Expand Widget Templates

2. Tekan Ctrl F serentak , dan cari kod ini :

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

3. copy code ni pulak

<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='5' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'> 

paste kan dia kat bawah kod tadi korang cari 2
warna merah 2 ikut korang la nak tukar ke tak nak besar ke x kotak korang korang mesti tau kan :D

4. Kemudian , tekan Ctrl F serentak lagi , cari kod ni

<head>

5. copy code nie pulak

<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' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(&quot;.comments-tab&quot;).addClass(&quot;inactive-select-tab&quot;);
$(selectTab).removeClass(&quot;inactive-select-tab&quot;);
$(&quot;.comments-page&quot;).hide();
$(selectTab + &quot;-page&quot;).show();
}
</script> 

facebook ID korang mesti letak kat situ kalau tak tau nak dapat mana facebook id tengok sini

www.facebook.com/mxdotmy <----------- contoh profile korang

korang tukar jadi graph.facebook.com/mxdotmy akan kuar  la id korang id = "xxxxxxxxxxxxxxxx"

copy dan letak kt situ

dan save la template korang

Seterusnya!!!

Design > Template Designer > Advanced > Add CSS

.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;}

copy code nie letak dekat CSS 2 dan save selesai :D 

Selamat mencuba kalau x jadi try google it :)

Related Post