Minggu, 20 Februari 2011

Cara Membuat Buku Tamu/Shoutbox Melayang di Samping Blog




Malem Sobat , kali ini ku dapet cara membuat buku tamu yang melayang disamping blog, ini tutorial ku dapat dari sini , simak yah caranya dibawah ini :

  1. Log in blogger
  2. Masuk ke rancangan
  3. Elemen laman
  4. tambah gadget, html/java script
  5. Kopi pastekan kode di bawah 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(http://i1094.photobucket.com/albums/i447/kang-da2ng/web/background_posting.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="http://i1094.photobucket.com/albums/i447/kang-da2ng/TabGB.png" />

    </a>
    </div>


    Masukkan script atau kode buku tamu kawan disini silahkan masukkan kode buku tamu nya disitu,
    http://i1094.photobucket.com/albums/i447/kang-da2ng/TabGB.png adalah link gambar, silahkan ganti sesuai keinginan

    Jika sudah langsung Simpan..................

    dan lihat hasilnya. Taraaaaaaaaaaaaa .... Cakepkan???? kalo punya aku gambarnya ku ganti jadi kayak di bawah ini punyaku ^_^

    ini gambar yang aku pake, aku modif sendiri loch , hehe

    Semoga Berhasil ....

    0 komentar:

    Posting Komentar