Skip to main content

Cara Membuat Buku Tamu Melayang/Terbang

Assalamu'alaikum! Halo sob, kita bertemu lagi. Sudah lama saya tidak posting artikel karena pulsa modem habis. Oke, kali ini saya ingin memposting tentang bagaimana cara memasang buku tamu melayang. Sobat sudah pernah lihat widget ini? Jika belum, sobat bisa cari blog yang memasang widget ini di google. Banyak sekali. Kebetulan saya tidak pasang, jadi maaf tidak ada contohnya ^^. Fungsi dari widget ini sangat banyak, salah satunya adalah sebagai penghias di blog kita. Oke sob, kita langsung ke TKP ...


1. Login blogspot > Rancangan/Tata letak

2. Tambah gadget

3. Pilih HTML/JavaScript

4. Copy kode berikut
<!-- right hidden chatbox by http:caratrikblog.blogspot.com/ START -->
<style>
#hcr {
position:fixed;
top:100px;
z-index:+1000;
}
* html #hcr {position:relative;}
.hcrtab {
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://b.imagehost.org/0611/buku-tamu.png') no-repeat;
}
.hcrcontent {
float:left;
border:2px solid #003e82;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcr(){
var hcr = document.getElementById("hcr");
var w = hcr.offsetWidth;
hcr.opened ? movehcr(0, 30-w) : movehcr(20-w, 0);
hcr.opened = !hcr.opened;
}
function movehcr(x0, xf){
var hcr = document.getElementById("hcr");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcr.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movehcr("+x+", "+xf+")", 10);}
}
</script>
<div id="hcr">
<div class="hcrtab" onclick="showHidehcr()"> </div>
<div class="hcrcontent">

-----Kode buku tamu-----

<br />
<div class="hc-credit">
<span style="float:left">

</span>
</div>
</div>
</div>
<script type="text/javascript">
var hcr = document.getElementById("hcr");
hcr.style.right = (30-hcr.offsetWidth).toString() + "px";
</script>
<!-- right hidden chatbox by http://caratrikblog.blogspot.com/ END -->

5. Paste pada kolom HTML/JavaScript

Simpan !

Loh? Kok mudah sekali? Memang mudah sob, yang susah yaitu bagi orang yang belum punya kode buku tamu. Kalau belum punya, silahkan baca di sini. Sekian dulu sob tentang cara membuat buku tamu melayang ^^

Comments

  1. terima kasih infonya sob.
    sungguh kreatif sekali dan template blog anda simple.
    dan sepertinya anda mempunyai kelebihan tersendiri.
    bila ada waktu saya akan berkunjung lagi sob :)


    #Semoga Sehat Selalu :)

    ReplyDelete

Post a Comment

Berkomentar dengan menggunakan kalimat yang baik dan santun. Dimohon untuk tidak berkomentar SPAM, karena komentar akan dihapus!
Tips:" Berlangganan Via Email " terlebih dahulu agar komentar cepat dibalas!