Cara Membuat Komentar Blog Berdampingan dengan Komentar Facebook

Halo selamat Pagi sobat Danny Blogger99.yaps pada postingan kali ini saya akan share tutorial blogger Cara Membuat Komentar Blog Berdampingan dengan Komentar Facebook mau tau caranya langsung saja cekidot

1  Langkah pertama login dulu dong akun blogger sobat

2. Klik rancangan lalu klik Edit HTML
3. Download template Sobat dulu untuk berjaga-jaga jika nanti terjadi kesalahan
4. Beri centang atau ceklis pada kotak kecil yang bertuliskan Expand Template Widget
5. Jika sudah, cari kode  ]]></b:skin>  (gunakan ctrl + f untuk mempermudah pencarian)
6. Kalau sudah ketemu maka masukkan kode berikut ini di atas kode ]]></b:skin>

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

Selanjutnya sobat cari kode </head>

Jika sudah ketemu, masukkan kode berikut ini tepat di atas kode </head>

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

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

    <meta content='ID FB SOBAT' 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>

tulisan yang berwarna Merah di atas, ganti dengan ID facebook Sobat, misalkan https://www.facebook.com/nama Sobat maka ID Sobat berada pada tulisan yang berwana merah. Namun jika Sobat belum merubah ID Sobat maka yang tertera adalah berupa angka. contohnya seperti ini: http://www.facebook.com/mdanny.pedrosa

Langkah Selanjutnya cari kode  <div class='comments' id='comments'>

Note :  Pada umumnya kode tersebut ada 2, copy dan pastekan kode berikut ini di bawah kedua kode <div class='comments' id='comments'>

<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'>

Note  : Pada penempatan kode yang ke dua Sobat hapus kode yang berwarna biru  <div class='comments comments-page' id='blogger-comments-page'> apabila kode di bawahnya sama

Kalau Sudah Save Dan Lihat Lah Hasilnya :)

Nah Ini Contoh Punya Saya :)

Semoga Bermanfaat :)