Thursday, November 15, 2012

MEMBUAT BUKU TAMU YANG MENGAMBANG DI SAMPING KANAN BLOG



Banyak cara untuk merias tampilan blog kita, sehingga terkesan lebih enak di pandang. salah satu caranya dengan menambahkan buku tamu tapi dengan tampilan yang mengambang di samping kanan dalam blog, seperti yang kita tau umumnya buku tamu menyatu dengan page blog, tapi kali ini kita bisa mencoba menambahkan buku tamu yang mengambang. seperti apa buku tamu yang saya maksud ! bisa di lihat seperti ini

Untuk membuat buku tamu yang mengambang di samping sisi kanan blog, yang perlu kita lakukan adalah

- Mendaftar di situs penyedia buku tamu gratisan, seperti di www.shoutmix.comataupun disitus laen.
- Setelah mendapatkan code javascriptnya, langkah selanjutnya adalah copykan code berikut
<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('https://lh4.googleusercontent.com/-0oQbpoKEDEc/TnB2mUSCJ-I/AAAAAAAAAiQ/yb8rfdiEYak/s800/tabs%252520copy.jpg') 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">

<!-- Begin ShoutMix - http://www.shoutmix.com -->
<iframe scrolling="auto" width="300" frameborder="0" src="http://www6.shoutmix.com/?aji1990" height="350" title="aji1990">
<a href="http://www6.shoutmix.com/?aji1990">View shoutbox</a>
</iframe>
<br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />
<!-- End ShoutMix -->

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
- Ganti teks yang berwarna hijau di atas dengan script /kode yang sobat peroleh dari situs penyedia buku tamu gratisan tadi.
- Letakkan di blog anda, seperti biasa masuk ke dasbord blog anda kemudianpaste kan kode tadi pada Tab Design >> Page Elements. 
- Klik ADD Widget >> HTML /Java Script. pilih Save untuk menyimpan.

"sekarang bisa di lihat hasilnya, sobat akan mempunyai buku tamu yang menyambang di sisi kanan blog."

Jika artikel ini bermafaat, jangan lupa untuk Follow blog ini ya !


Related posts

Description: MEMBUAT BUKU TAMU YANG MENGAMBANG DI SAMPING KANAN BLOG Rating: 4.5 Reviewer: Yohan Pornomo ItemReviewed: MEMBUAT BUKU TAMU YANG MENGAMBANG DI SAMPING KANAN BLOG
Al
Mbah Qopet Updated at: 6:06 AM

0 comments:

Post a Comment