Membuat Tab Komentar Facebook dan Blogger

Halo teman, sudah lama saya tak posting.. kali ini saya ingin berbagi cara Membuat Tab Komentar Facebook dan Blogger seperti yanada pada wordpress. Nah penasaran??? langsung saja ikuti cara dibawah ini

1. Seperti biasa login ke akun blogger sobat kemudian ke EDIT HTML

2. Di EDIT HTML jangan lupa untuk mencentang EXPAND WIDGET

3. temukan kode berikut class='comments' dengan bantuan CTRL+F

4. Copy kode dibawah ini dibawah kode class='comments'

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' 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("#blogger-comments");' 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 == "item"'> <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'>

5. Temukan kode <head> dengan bantuan CTRL+F dan Copy kode dibawah ini diatas </head>

<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) {

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

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

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

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

}

</script>

6. Temukan kode #comments dengan bantuan CTRL+F dan Copy kode dibawah ini diatas kode #comments

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

7. Simpan dan lihat hasilnya. jangan lupa ganti YOUR_FB_ID. dengan kode facebook sobat

Good Luck Guys