Sabtu, 04 Juni 2011

Membuat buku tamu blogger sembunyi di sisi blog

Cara Membuat buku tamu tersembunyi, Buku tamu atau tempat untuk menulis komentar di blogger sangatlah berguna sebagai wadah untuk berinteraksi antara pengunjung dan si empunya blog. Tutorial semacam ini tentu sangat sering kita jumpai saat kita berkunjung ke blog-blog lain untuk mencari informasi. Sekedar mengingatkan kembali, berikut langkah-langkah untuk membuatnya:


  • Login ke blog
  • Pilih tab rancangan, klik Tambah Gatget

    • Selanjutnya pilih HTML/JavaScript
    • Copas dan Simpan kode dibawah ini:

    <style type="text/css">

    #gb{
    position:fixed;
    top:140px;
    z-index:+1000;
    }
    * html #gb{position:relative;}

    .gbtab{
    height:220px;
    width:32px;
    float:left;
    cursor:pointer;
    background:url('http://i1089.photobucket.com/albums/i352/infokita1978/cooltext508153753.gif') no-repeat;
    }
    .gbcontent{
    float:left;
    border:5px solid #ff0000;
    background:#000000;
    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">

    Masukkan kode Shoutmix/iklan anda disini

    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    <img src="http://i1089.photobucket.com/albums/i352/infokita1978/cooltext507237721.png" border="0" alt="Photobucket" /></a>
    </div>
    </div>
    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script></div>

    • Jika sudah selesai, Save dan lihat hasilnya.
  • Jangan lupa Komentarnya

1 komentar:

Zacky Sang Putra mengatakan...

MAAF LEH TANYA GAK,,,,,HEHEHE
KALO Shoutmix TU APA CE,,, HEHEHE

AKU GAK BISA NI,,HEHEHE...MKCH

Posting Komentar

negrionta tutorial © 2011 Template by:
rizkymakkah