Kotak komentar melayang seperti chatbox

Yahhh koding memang gak pernah habis dan gambar di atas adalah hasil dari otak atik area komentar sehingga jadi seperti itu kotak komentarnya ( melayang ) dan sekarang aku share cara membuatnya siapa tau suatu saat lupa kan bisa baca lagi disini.

1. Masuk ke dalam template
2. Centang Expand Template Widget
3. 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>

4. Cari lagi 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 cari lagi kode seperti ini BLOG_CMT_createIframe(' kode lengkapnya seperti ini

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

Perhatikan kode </div> tambahkan kode di bawah ini di bawah kode </div> tersebut.

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

Dan jika di gabung kodenya akan 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>

Setelah semua selesai klik Pratinjau dan jika gak ada yang error silahkan klik Simpan template