Membuat Kotak Pesan Melayang

Kali ini kita akan mencoba membuat Kotak Pesan seperti Cbox ataupun yang lain yang sekiranya sejenis dengan itu. Jadi teman kita akan sangat simple ketika  berkunjung ke blog kita dan ingin meninggalkan pesan pada blog kita.

Silahkan ikuti panduan berikut ini :

1. Log in lah pada account blogger anda

2. Masuklah ke Rancangan

3. Pilih Elemen Halaman

4. Kemudian pilih Tambah Gadget, dan pilih html/javascript.

5. Selanjutnya silahkan copy script berikut ini.

<style type="text/css">
.gb_fixed{
position:fixed;
top:0px; right:0px;
z-index:+10;
}
* html .gb_fixed {position:relative;}
#hidden_gb2 {
display:none;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvJ2-ju0CLihyosWMvcOzW3nwOL1DACEDBDsgs1EocVj9q8G5oxadhBkNPlQY0Qrxt9RVYrrqbn_o-lV-Gp0Yy6GZBcleufyED6bjd8_JybGWvzNk3L8afLlQeD-g0CDqJpuIUY2iFWLbO/s1600/papers.jpg
)repeat;
color:#000;
padding:10px 10px 10px 10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-bottom-right-radius:10px;
-moz-border-radius-topleft:10px;
-webkit-border-top-left-radius:10px;
-moz-border-radius-bottomleft:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-box-shadow: 2px 2px 4px #8bd268;
-moz-box-shadow: 2px 2px 4px #8bd268;
}
</style>
<div class="gb_fixed">
<table id="hidden_gb2" cellpadding="0" cellspacing="0">
<tr><td>
<div><a href="javascript:void(0)" onclick="gb_showHideGB()"><b style=" background:-moz-linear-gradient(top, #051547, #999, #051547); color:#6cec17;
padding:10px 10px 10px 10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-bottom-right-radius:10px;
-moz-border-radius-topleft:10px;
-webkit-border-top-left-radius:10px;
-moz-border-radius-bottomleft:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-box-shadow: 2px 2px 4px #8bd268;
-moz-box-shadow: 2px 2px 4px #8bd268;"> TUTUP BUKU TAMU </b></a></div>

Masukkan script atau kode buku tamu kawan disini

</td></tr></table>
</div>
<script src="http://kangdadang.googlecode.com/files/shouteffect.js"></script>
<div style="z-index:+5" class="gb_fixed">
<a href="javascript:void(0)" onclick="gb_showHideGB()">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWdSd1yjxeUKORRkGF6PdYfhcH6s9EOQMCmhlkjyTzMXJnW94W-FEHA1lwjZUcBKVN4b2eHuiid24FcsU1VIDECfp_idyAQrIQv_DHKN0oMeNw6aUVNvlPKhyyVzm9z8i6q8pyySGH1rg/s1600/TabGBcopy.png" />

</a>
</div>

Silahkan Anda edit dan sesuaikan untuk yang berwarna BIRU.
Oke selamat mencoba kawan semoga berhasil. 
Referensi : http://tip-triksblogger.blogspot.com/2011/01/membuat-buku-tamu-melayang-di-samping.html