Tutorial memasang kolom komentar blog dan facebook model tab

tutorial-memasang-kolom-komentar-blog

Mengelola blog atau menulis dalam blog merupakan suatu keinginan para blogger. Tujuannya agar blog anda banyak disukai dan disenangi oleh para pengunjung dari segi design maupun tata letak, sehingga tampilan blog anda menarik perhatian oleh para pengunjung blog. Tak tinggal juga untuk mempercantik kolom komentar di blog.

Memasang kolom komentar blog dan facebook salah satu cara memperindah tampilan blog anda, khususnya pada tampilan postingan blog anda. 

Adapun cara memasang kolom komentar blog dan facebook model tab sebagai berikut :

1. Login ke blogger.com
2. Di dasbor blog, masuk ke Template lalu pilih Edit HTML
3. Carikan kode: <div class='comments' id='comments'>
4. Copykan kode script dibawah ini dan pastekan tepat dibawah kode: <div class='comments' id='comments'>

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' 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("#blogger-comments");' 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 == "item"'><div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='550'/></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='IDFANPAGEFACEBOOK' 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>

5. Kalau sudah selesai, jangan lupa simpan Template blog anda
6. Lihat hasil blog anda

Note: 
  • Gantikan IDFANPAGEFACEBOOK dengan Kode / No / Id Fan Page Facebook punya anda.
  • Untuk melihat IDFANPAGEFACEBOOK adalah: login ke Halaman Facebook --> Pengaturan  --> Info Halaman, kemudian lihat di bawah sekali ada tulisan ID Halaman Facebook : 10026565009xxxx.
  • Ukuran kolom komentar facebook harus sesuai dengan ukuran di blog anda. Silahkan ganti angka berwarna biru di atas (width='550').
  •  Kalau ada 2 kode  <div class='comments' id='comments'> bisa pilih salah satunya.

Demikian tipsnya, sangat gampangkan caranya semoga bermanfaat. Jangan lupa komen di bawah kalau belum jelas mungkin bisa di bantu.

0 Response to "Tutorial memasang kolom komentar blog dan facebook model tab"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel