Selasa, 01 Februari 2011

Membuat Buku Tamu Tersembunyi


Widget Shoutmix atau Buku Tamu ini memang cukup banyak kegunaannya,selain untuk sekedar sapa menyapa antar pemilik blog, juga dapat untuk pesan konfirmasi, dan memberitahukan sesuatu kepada pemilik blog,dari segi fisiknya sih lumayan makan tempat,jadi saya buat saja tutorial ini guna menghemat tempat untuk widget - widget penting lainnya...OK dah tanpa basa - basi lagi kita mulai tutorialnya...




  1. Login ke akun Blogger anda.
  2. Pada Tab, pilih Rancangan > Edit Laman.
  3. Kemudian Add Gadget / Tambah Gadget pilih HTML/Javascript.
  4. Jika sudah silahkan masukan kode dibawah ini ke dalam jendela HTML/Javascript.


  5. <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('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.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">

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

Terakhir simpan dan lihat hasilnya,untuk tinggi dan lebar bisa anda atur sendiri...
tulisan berwarna merah ganti dengan kode Shoutbox anda.

Semoga Bermanfaat,terimakasih atas kunjungannya and jangan lupa tinggalkan komentar yah..

11 comment:

Unknown mengatakan...

Thank'z bro......

inilah yang aq mahu......

Unknown mengatakan...

@Dhian SpSama - sama teman seperjuangan...hehehe...

Dhian mengatakan...

@ExzhadhianOureght....

pakar obat kuat mengatakan...

oke.....kau tahu yang ku mau.....

Unknown mengatakan...

@ pakar obat kuat : Oreght !! terimakasih telah berkunjung gan..

Alex Irfani mengatakan...

cara mendapatkan kode Shoutbox nya gimana sob ?

Alex Irfani mengatakan...

than'x sob, udah berhasil di blog_ ku yang satunya,

tutorial yang menarik..

Unknown mengatakan...

terimakasih juga sob telah berkunjung,selamat berselancaria,,

:)

Amung Hermansyah mengatakan...

Ok... sippplah bisa euy...
hatur nuhun nya...

bali tour mengatakan...

mantap gan, ijin baca...

Unknown mengatakan...

okey broo...
jgn lupa like and plus yaa..
:)

Posting Komentar