Tenny Technology | The Next Generation

Rabu, 15 Agustus 2012

0 Cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger

Date: Rabu, 15 Agustus 2012 Rabu, Agustus 15, 2012
Category:
Author: Refky wijaya
Share:
Responds: 0 Comment
Judul: Cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh Refky wijaya

Cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger - Jika anda ingin kotak komentar blog-nya mau ditambahin dengan kotak komentar facebook yang bentuknya berdampingan dengan komentar blogger, anda tinggalmodifikasi saja pada template blog anda. Berikut tutorial cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger, penasaran ikuti saja caranya.

1.    Seperti biasa Login Ke Akun Blogger anda.
2.    Pada Dasbor Pilih Rancangan Design Kemudian Pilih Edit HTML dan jangan lupa untuk mencentang kolom expand template widget.
3.    Copas kode berikut tepat dibawah kode <div class='comments' id='comments'> pada template anda.

Keterangan : apabila terdapat 2 kode <div class='comments' id='comments'> yg sama, silahkan anda pastekan ke kode yg kedua.

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

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='Masukan 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>
<style>.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;}</style>

4. Simpan Templatenya Dan Lihat Asilnya..!

Artikel Terkait :



Posting Komentar