MEMBUAT BUKU TAMU TERSEMBUNYI

Mungkin teman-teman semua sudah sering melihat buku tamu tersembunyi ini ketika teman-teman semua melakukan blogwalking di blog lainnya, nah buku tamu itulah yang dimaksud, biasanya di taruh di sebelah kanan blog.

Buku tamu tersebut akan keluar ketika teman-teman klik gambar Buku Tamunya yang berwarna hijau itu dan akan tersembunyi lagi ketika teman-teman klik kembali gambarnya atau klik 'close/tutup'. Menarik bukan teman-teman untuk dicoba? Selain itu juga cara ini sedikit menghemat tempat di dalam blog.

Untuk cara membuatnya ikuti langkah-langkah di bawah ini:

sebelum teman - teman membuat buku tamu di blog, teman - teman harus memiliki kode buku tamu, teman - teman sekalian bisa mendapatkannya di Shoutbox, Cbox, atau shoutmix. setelah teman - teman memiliki kode buku tamu tersebut, bisa lanjut ke langkah berikut :

1. login ke aku blogspot masing  - masing
2. klik Rancangan/Design >> Page Element >> Add a Gadget >> HTML/Javascript.
3. Copy Paste kan semu kode dibwah ini dan masukkan di dalam konten HTML/Javascript

<style type="text/css">
    #gb{
    position:fixed;
    top:50px;
    z-index:+1000;
    }
    * html #gb{position:relative;}


    .gbtab{
    height:100px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEin-ir0-VDtC9zYpSUqsafbfi0bNJCgbTdsshXKzTfdRdp-rzySkHmDrMDwF_bLPwRMJ8ablCY3DSH6Azjzj-D4ba38niaP9NZzF0Wcqwett8q8s-67YaWBqx_naDqqmdakLlPOv6pL47il/') no-repeat;
    }
    .gbcontent{
    float:left;
    border:2px solid #A5BD51;
    background:#F5F5F5;
    padding:10px;
    }
    </style>


    <script type="text/javascript">
    function showHideGB(){
    var gb = document.getElementById("gb");
    var w = gb.offsetWidth;
    gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
    gb.opened = !gb.opened;
    }
    function moveGB(x0, xf){
    var gb = document.getElementById("gb");
    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
    var dir = xf>x0 ? 1 : -1;
    var x = x0 + dx * dir;
    gb.style.right = x.toString() + "px";
    if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
    }
    </script>


    <div id="gb">


    <div class="gbtab" onclick="showHideGB()"> </div>


    <div class="gbcontent">


    < Letakkan disini kode Shoutbox Anda>


    </div>


    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script></div>

4. Ganti tulisan <Letakkan disini kode Shoutbox Anda> dengan kode shoutmix atau cbox    teman - teman.
5. Teman - teman juga bisa atur posisinya perhatikan angka 50 yang berwarna merah, ubah saja nilai atribut top-nya kalau mau lebih keatas sedikit ubah menjadi 30px atau 20 px.
6. Jika sudah klik save dan lihat hasilnya

** SELAMAT MENCOBA SEMOGA SUKSES**