Minggu, 27 Januari 2013

Cara Membuat Kotak Komentar Facebook Dan Blog Berdampingan



Komentar Facebook dan Blog Berdampingan

1. Masuk ke akun blogger sobat
2. Selanjutnya masuk pada bagian Template
3. Klik Edit HTML
4. Silahkan centang Expand Template Widget
5. Sudah itu, Anda cari kode ]]></b:skin>, untuk memudahkan pencarian, silahkan tekan ctrl+f.
6. Setelah ketemu, silahkan letakkan kode di bawah ini tepat di atas kode tadi
.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;}

catatan:
Silahkan hapus kode berwarna merah itu, jika Anda ingin membuat kotak komentar facebook menjadi transparan.

7. Kemudian Anda cari kode </head> , seperti tadi untuk lebih memudahkan pencarian tekan ctrl+f
8. Jika sudah ketemu, silahkan letakkan kode di bawah ini tepat di atas kode </head> tadi
<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 Anda 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>

catatan:
Silahkan Anda ganti tulisan berwarna merah tersebut dengan ID FB Anda. Sudah tahu kan, apa itu ID FB? Jika Anda sudah ganti, misalnya http://facebook.com/justangzealotous berarti ID FB kamujustangzealotous. Namun, jika Anda belum menggantinya, maka ID FB Anda adalah sebuah angka-angka, contoh http://facebook.com/1234567890. Untuk melihat ID FB, Anda bisa masuk ke profil FB kamu, kemudian silahkan lihat pada adress bar.

9. Selanjutnya, silahkan Anda cari kode <div class='comments' id='comments'>
10. Umumnya, kode <div class='comments' id='comments'>, terdapat 2. Silahkan Anda letakkan kode berikut tepat di bawah kedua kode tersebut.
  <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='3' width='400'/>
    </b:if>
    </div>
    <div class='comments comments-page' id='blogger-comments-page'>

catatan:
Silahkan Anda, hapus kode berwarna merah tersebut, jika kode di bawah sama. Kalau tidak, yah tidak perlu dihapus. Perhatikan, untuk yang nomor 3 adalah jumlah komentar yang akan muncul di kotak komentar facebook, untuk yang nomor 400 adalah lebar kotak komentar. Silahkan ganti sesuai dengan keinginan Anda.

11. Setelah itu, klik Simpan Template


Sumbernya disini : http://adf.ly/JnZVx


Artikel Terkait Lainnya :



Ditulis Oleh : Rendo Aditama

Artikel Cara Membuat Kotak Komentar Facebook Dan Blog Berdampingan ini ditulis oleh Rendo Aditama pada hari Minggu, 27 Januari 2013. Terimakasih atas kunjungan Anda pada blog ini. Kritik dan saran tentang Cara Membuat Kotak Komentar Facebook Dan Blog Berdampingan dapat Anda sampaikan melalui kotak komentar dan jangan lupa klik like facebook diatas ya

:: Add My FB ::

Tidak ada komentar: