24 December 2011

Cara Membuat Buku Tamu Melayang

Coba sampeyan tuju pandangan ke samping kanan atas blog ini disitu ada gambar yang ada tulisannya Guest Book nah... itulah Buku Tamu dengan background, yang kalau diklik akan keluar form isian Nama, Website dan Message. Buku Tamu atau Guest Book tersebut melayang artinya tidak terpengaruh oleh scroll mouse, walaupun mouse digulir ke bawah Buku Tamu tersebut tetap terlihat.


Untuk membuatnya ikuti langkah berikut :
  • Masuk ke Blogger
  • Klik Rancangan
  • klik Elemen Laman
  • klik Tambah Gadget
  • Klik "HTML/JavaScript"
  • Kemudian Copy/Paste kode di bawah ini :


<style type="text/css"> #gb{ position:fixed; top:50px; z-index:+1000; } * html #gb{position:relative;} .gbtab{ height:150px; width:30px; float:left; cursor:pointer; background:url('http://1.bp.blogspot.com/_w-dfDljRV3Q/TRXJ-ExUXII/AAAAAAAAAn8/sl_ZVhQFU9c/s1600/buku+tamu.png') no-repeat; } .gbcontent{ float:left; border:1px solid #B3B3B3; background:#E6E6E6; padding:5px; } </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">   <!-- BEGIN CBOX - www.cbox.ws - v001 --> Code CBox milik sampeyan <!-- END CBOX -->  <br/>Mau buat buku tamu ini ?<br/>Klik <a href="http://belajar-coreldraw.blogspot.com/2011/12/cara-membuat-buku-tamu-melayang.html"target="_blank"> di sini </a> <div style="text-align:right"> <a href="javascript:showHideGB()"> [hide] </a> </div> </div> </div> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.right = (30-gb.offsetWidth).toString() + "px"; </script>

Keterangan :
Yang berwarna merah ganti dengan kode yang sampeyan peroleh dari Cbox
Pada kode diatas Icon Buku Tamu-nya seperti gambar disamping. Gambar dapat dingganti sesuai dengan kreasi sampeyan sendiri dengan terlebih dahulu mendesainnya di CorelDRAW, Kemudian upload di blogger atau hosting lain kemudian ambil URLnya dan pasang sebagai background.

Sekian, ini ada singkong goreng dan secangkir kopi, mau sampeyan?...


Author : Zainoel Arifin Isa'i

Ketika aku tidak nongkrong di warung kopi atau menyusuri hutan atau juga mendaki gunung, aku sibuk menjadi tukang desain lepas/ freelance yang bermarkas di sudut ruang kamar belakang rumah di daerah pelosok desa terpencil lereng gunung Arjuno.... Facebook : -Mbah Djojo-

10 comments:

  1. Artikelnya menarik gan... mau nanya nih gan, saya tertarik dengan tampilan Page blog ini, bagaimana cara buatnya yah gan ?

    ReplyDelete
  2. Terima kasih sebelumnya, tampilah halaman blog ini menggunakan template desain - Simple yang didukung oleh blogger, dan untuk edit template sumua sudah aku posting pada blog ini gan..

    ReplyDelete
  3. makasih bgetz..... ini membantu bget...

    ReplyDelete
  4. kunjungan balik YUgh gan http://firecybernet.blogspot.com/

    ReplyDelete
  5. makasih info nya gan... udah saya pasang di blg saya.. tapi ga lama posisinya jadi pindah kebawah... kenapa ya?

    ReplyDelete
  6. ayo gabung di..
    http://www.ayobai.com/sastrosajadi

    ReplyDelete
  7. Infonya sangat bermanfaat gan. saya rasa artikel ini membuat saya lebih tahu dan lebih paham.
    oh iya gan perkenalkan saya seorang blogger pemula yang masih belajar tentang blog.
    makanya saya semangat cari info-info lain yang mungkin saja bermanfaat buat saya peribadi.
    Oh iya berikut ini artikel yang saya bangga-banggakan gan. dibaca ya.
    Cara Membuat Blog dengan Blogger
    Cara Memasang Animasi Burung Twitter Melayang di Blog
    Cara Memasang Widget Alexa Rank di Blog
    Cara Membuat About Me Di Blog
    Cara Membuat Buku Tamu Tersembunyi Pada Blogger

    Semoga semua yang saya tulis bermanfaat buan agan pribadi termasuk pengunjung blog ini.
    Kao mw buat buku tamu agan bisa baca di artikel Cara Membuat Buku Tamu Tersembunyi di Blog

    Ok gan. terimakasih lagi atas infonya, semoga agan rajin updatenya dan sukses selalu.
    salam kenal dari saya.

    ReplyDelete
  8. Nice artikelnya, Thanks infonya :)
    http://grosirprodukgreenworld.com/
    http://kedaiacemaxs.com/
    http://obatacemaxsid.com/

    ReplyDelete
  9. Makasih infonya gan,,
    Sangat bermanfaat

    ReplyDelete

Berkomentarlah yang bijak, iklan/spam langsung dihapus