Senin, 11 Juni 2012

Trik Mudah Membuat Buku Tamu Tersembunyi di Blog

Trik Mudah Membuat Buku Tamu Tersembunyi di Blog. Beberapa saat lalu dibuat postingan tentang cara membuat buku tamu di blog. Keberadaan buku tamu tersebut sangat bermanfaat untuk berinteraksi dengan para pengunjung. Dan postingan kali akan membahas bagaimana keberadaan buku tamu tersebut tidak memenuhi ruang di blog kita? Hal tersebut bisa dilakukan dengan cara membuat buku tamu tersembunyi, yang ketika dibutuhkan maka buku tamu tersebut bisa ditampilkan.

Cara Membuat buku tamu tersembunyi tidaklah sulit. Tidak harus menuju edit HTML blog yang kadang terkesan agak ribet. Untuk lebih cepanya berikut adalah tata cara memasang buku tamu tersembunyi tersebut:


  • Masuklah ke blogspot Anda

  • Klik Add Gadget (bisa yang mana saja, baik di sidebar, di atas posting, maupun footer) ==> pilih HTML/Javascript

  • Kopi Kode di bawah ini:

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

    .gbtab{
    height:120px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('http://i463.photobucket.com/albums/qq354/imtihan_2008/MENU/th_Chatbox.png') 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&puot;>

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

    <div class="gbcontent">

    Letakkan Kode Buku Tamu/ Cbox di sini

    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    [Close]
    </a>

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

  • Hapus tulisan Letakkan Kode Buku Tamu/ Cbox di sini dan ganti dengan kode Cbox Anda

  • Paste di di Gadget HTML/Javascript tadi

  • Anda juga bisa mengganti tombol untuk memunculkan dan menyembunyikan dengan tombol Anda sendiri, caranya dengan mengganti link berikut http://i463.photobucket.com/albums/qq354/imtihan_2008/MENU/th_Chatbox.png dengan link hasil simpanan sendiri

  • Klik Save

  • Selamat!!! Anda sudah bisa memasang buku tamu tersembunyi di blog

Sekian[]

Caraku Membuat

Related Post

Blog
Website