Cara Membuat komentar facebook berdampingan dengan komentar blogger

Cara Membuat komentar facebook berdampingan dengan komentar blogger

Cara Membuat komentar facebook berdampingan dengan komentar blogger

Wednesday, February 5, 2014

Cara Membuat komentar facebook berdampingan dengan komentar blogger

Filled under:
Print Friendly and PDF Translate

Assalamu'alaikum,,,,


Kali ini akan saya kasih Cara Membuat komentar facebook berdampingan dengan komentar blogger,
Gunanya dari itu adalah biar pengunjung bisa memilih mau berkomentar dengan blogger atau dengan facebook,

Berikut langkah-langkahnya untuk memasang komentar facebook dengan komentar blogger berdampingan:

1. Loggin di blogger sobat pastinya.

2.  Klik Menu Template.

3. Pilih EDIT HTML.

4. Setelah masuk, cari kode ini ]]></b:skin> (tekan ctrl+f agar lebih mudah)

 5. copy kode dibawah ini tepat diatas 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;}


 6. Kemudian Cari lagi kode </head>

7. Lalu copy lagi kode dibawah ini dan letakkan 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 kalian disini' 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>


8. Teks yang bertuliskan ID FB SOBAT DISINI ganti dengan URL facebook sobat,
Contoh: http://facebook.com/minan.tria.ifan

9. Terakhir cari code <div class='comments' id='comments'>
Cari yang kode ke 2 jangan pilih yang pertama, karna ada dua kode disana nantinya, letakkan kode dibawah ini tepat di atas kode <div class='comments' id='comments'>

(Tetapi kalau tetap tidak keluar maka taruh kode dibawah ini di 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://4.bp.blogspot.com/-X6HutG7t0b0/VIZz74ySwzI/AAAAAAAAAQE/kseQzJbKzGA/s1600/facebook-logo1.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='600'/>
    </b:if>
    </div>
    <div class='comments comments-page' id='blogger-comments-page'>


 10. Width='600' diatas adalah lebar dari komentar nantinya, silahkan atur sesuka kamu.

11. save, dan lihat hasilnya

Mudahkan,,,,, silahkan mencobanya
 
  

Comments
0 Comments

0 comments:

Post a Comment

 

Copyright © 2014. "MASTER MUNYIL". Designed by: BigsMaster