29 November 2012

Cara Membuat Buku Tamu Melayang Pada Blog


Pak Inspector kali ini akan membahas cara membuat buku tamu melayang di sisi kanan blog..Caranya cukup mudah,gan hanya memerlukan sedikit tambahan script untuk buku tamu agan.Ayo kita mulai saja bahasan kita tentang cara membuat buku tamu melayang di sisi kanan blog.





Ikuti langkah-langkah berikut ini :

1.Login ke akun blogger sobat
2.Klik menu RANCANGAN
3.Klik Tambah Gadget

4.Klik/pilh HTML/Javascript
 5.Masukan kode berikut di kolom yang telah disediakan

<!-- right hidden chatbox by http://krisnakumara.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">
masukan kode shoutbox/buku tamu sobat di sini
<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://krisnakumara.blogspot.com// END -->

 6.Klik SIMPAN
7.Selesai

Semoga artikel saya tentang Cara Membuat Buku Tamu Melayang Di Sisi Kanan Blog dapat bermanfaat untuk sobat sekalian.
ket : Masukan/ganti tulisan yang berwarna MERAH dengan kode chatbox agan.

0 komentar:

Posting Komentar