02 Januari 2013

Menggabungkan Komentar Facebook dan Blog Berdampingan

Share on :
Hallo Warga Pangkalan Susu , Kini aku coba membuat artikel Menggabungkan Komentar Facebook dan Blog seperti gambar di atas.

Masuk ke Blog kamu pada Dasbor Pilih Template dan Edit HTML (jangan lupa centang kolom Expand Template Widget).

Setelah itu cari  <div class='comments' id='comments'> apa bila terdapat 2 kode seprti ini <div class='comments' id='comments'>  harap copas kode di bawah yang ke 2 saja.

Lalu Copy kode ini

<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='ID FB Sobat 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>
                                                                                                                                                                                   Yang warna Merah ganti dengan alamat Facebook kamu,
contoh 'https://www.facebook.com/Famels' jangan lupa Add ya

Jangan Lupa Baca Juga

|Membuat Status Komentar Warna Biru Kosong | Mengganti Template | Mempercantik Blog Cara Bikin Blog | Kotak Blogroll Marquee | Dasar-dasar HTML | Alexa ku ngambek | Cara Bikin Tulisan Acak Blog Pangkalan Susu
Comments
1 Comments

1 komentar:

biro perjalanan on 25 Maret 2013 pukul 07.13 mengatakan... Balas Wak

ane udah coba, tapi kok gak muncul ya gan di blog ane

Posting Komentar

Tinggalkan Komentar Anda Mengenai Artikel Diatas

Terima Kasih Atas Komentar Anda