Cara membuat kotak komentar di blog kita melayang seperti chatbox, efek ini di dapat dari gabungan jquery dan css, hasilnya pun ok.

Mari kita mulai utak atik :

1. Masuk BLOG anda
2. Klik Rancangan
3. Klik Edit HTML
4. Centang Expand Template Widget
5. Cari Kode </head>    ( tekan bersamaan Ctrl + F atau tekan F3 untuk Mempercepat pencarian )
6. Simpan Kode di bawah ini di Atas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
    $(&quot;.posisi&quot;).click(function(){
        $(&quot;#gaya-komentar&quot;).slideToggle(&quot;slow&quot;);
        $(this).toggleClass(&quot;komentar-active&quot;); return false;
    });
});
</script>
<style type='text/css'>
.komentar-terbang {
position:fixed;
top: 0px; right:450px;
z-index:+1000;
}
#gaya-komentar { /* by system of blog */
    height: auto;
    background: #898787;
    width: auto;
    display: none;
    padding: 10px;
    border:2px solid  #4173af;
    background:#ffffff;
    padding:10px;
}
.posisi {
    position:fixed;_position:relative;top:50px; left:0px;
    clip:inherit;
    _top:expression(document.documentElement.scrollTop+
    document.documentElement.clientHeight-this.clientHeight)
}
.komentar-active {
    background-position: right 12px;
}
</style>

Selanjutnya silahkan cari kode <div class='comment-form'>

Setelah anda temukan kodenya silahkan simpan kode di bawah ini, di atas kode tersebut

<div class='komentar-terbang'>
<div id='gaya-komentar'>

Selanjutnya pada bagian ini mungkin akan berbeda untuk setiap template tapi coba saja cari kode seperti ini BLOG_CMT_createIframe(&#39; kode lengkapnya seperti ini

<script type='text/javascript'>
      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div>

 Setelah kode nya ketemu silahkan tambahkan kode di bawah ini, di BAWAH kode </div>

</div></div><div id='posisi'><a class='posisi' href='#'><img alt='Buku Tamu' border='0' heigth='125' src='https://sites.google.com/site/sin1ajablog/gambar-system-of-blog/komen.png'/></a></div>

☻ Maka Jadi nya nanti seperti ini :

<script type='text/javascript'>
      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div></div></div><div id='posisi'><a class='posisi' href='#'><img alt='Buku Tamu' border='0' heigth='125' src='https://sites.google.com/site/sin1ajablog/gambar-system-of-blog/komen.png'/></a></div>

Jika sudah selesai silahkan ☛  Pratinjau terlebih dahulu untuk jaga - jaga di saat ada kesalahan.

jika sudah oke☻ maka silahkan ☛  SIMPAN TEMPLATE anda.

Bila tidak berhasil, Komentar saja apa masalah nya dan saya akan membantu anda :)