Terlalu banyak widget tentunya akan membuat tampilan Blog menjadi kurang rapi dan terkesan kumuh.
Tapi mengingat fungsi widget yang sangat penting, tentunya kita akan bingung dalam memilih widget yang ingin ditampilkan.
nah kali ini aku mau memberikan kalian solusi, jika widget terlalu besar kamu bisa menyembunyikannya di samping blogmu, dan untuk memunculkannya tinggal klik saja.
Contohnya seperti Widget Buku Tamu milikku yang ada disamping blogku ini.
- Nah untuk membuatnya, kamu login dulu ke Bloggermu!
- Setelah itu Copy script yang ada di bawah ini:
#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/AVvXsEi5l5_UGhB6rP-L-Ekuje48oZCYufgTFHLfPEq901ogkTF8NguOy9FU-UjCDdBqo6u_bLHhiYXzsxb0OGyC9NFQNoBaGiZE2PCW3-cXVOhop2DxeUj5Ql0OKhNnZs4Df6GaYYP02T4uLmmq/') 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">
<br /><a href="" title="">Yudhaime's Site</a><br />
<div style="text-align:right">
<a href="">
</a>|<a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>
- Tulisan yang berkedip kamu ganti dengan kode HTML widget kamu!
- Kalau sudah pastein di Kotak Di bawah ini:
0 comments:
Posting Komentar