Oki Wahyu Blog

Membuat Blogroll Buku Tamu di Blogspot | Tips dan Trik kali ini akan membahas tentang membuat blogroll buku tamu di blogspot. Blogroll adalah membuat form buku tamu melayang di layout blog, ketika blog di naik turunkan form akan tetap pada posisinya. Mau tau caranya? ikuti perintah berikut :

1. Login ke blogger.
2. Klik menu rancangan.
3. Elemen lemen.
4. Tambah gadget HTML/Javascript.
5. Gadget bebas di letakkan dimana saja.
6. Kemudian copy paste script 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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqGZze9eY1yZapm1bEUevTFOZ0KKIwjqKtrPvSnxtK4kv38GlVn8g6ymdiEVt-6sU5mtaLtJrBWGR8_h0H2rnxZGjEXPiAN74ufsFXGEFEpw3bm7pwg7bHksJiMCUl4EXdTZT619yjTJYz/') 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">


MASUKKAN SCRIPT BUKU TAMU DISINI


<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>


7. Ganti Tulisan berwarna merah tersebut dengan script buku tamu anda.
8. Kemudian tinggal simpan.