Membuat gambar melayang di Blogger

Selamat Pagi....
Kali ini saya akan sedikit berbagi tentang bagaimana cara memasanggambar melayang di blog kita. Hal ini bisa dimanfaatkan sebagai lahan iklan(baik gratisan maupun tidak).

Okay, langsung saja...Inilah Caranya .....
1. Masuk ke akun blogger anda.
2. Setelah itu buka halaman Design/Rancangan
3. Pada bagian elemen halaman, klik tambah gadget/add new element
4. Pilih HTML/JavaScript
5. Masukkan kode berwarna biru di bawah ini...

<style type="text/css">
#gb{
position:fixed;
top:325px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:30px;
width:960px;
float:center;
cursor:pointer;
background:url('') no-repeat;
}
.gbcontent{
float:center;
border:1px solid #A5BD51;
background:#000000;
padding:1px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 125-w) : moveGB(125-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">

SCRIPT IKLAN PPC ANDA DISINI / APA SAJA YANG INGIN DITAMPILKAN!

<div style="text-align:right">
<a href="javascript:showHideGB()">
[Close]
<a href="http://dugaja.blogspot.com/2010/09/membuat-gambar-melayang-di-blogger.html" target="_blank">
[Widget By ganef]
</a>
</a></div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.down = (125-gb.offsetWidth).toString() + "px";
</script></div>

KETERANGAN :::

angka berwarna hitam adalah lebar dan tinggi gambar anda. Anda bisa menyesuaikan dengan gambar/iklan anda.

Lalu tulisan berwarna merah di atas, silahkan anda ganti dengan alamat / script yang anda miliki.

Terima Kasih... 

Memunculkan gambar Acak di Header Blog

Selamat Pagi!!!!
Kali ini saya akan sedikit berbagi kepada teman-teman semua tentang bagaimana cara memunculkan gambar acak pada header blog kita, khususnya untuk pengguna blogger.

Oke, langsung saja caranya.....
1. Silahkan masuk ke akun blogger anda.
2. Buka bagian Design/rancangan.
3. Masuk bagian Elemen halaman.
4. lalu klik Add Widget.
5. Pilih HTML/JavaScript.
6. Masukkan kode berwarna biru berikut ::

<script type="text/javascript">
var banner= new Array()
image[0]="urlimage1"
image[1]="urlimage2"
image[2]="urlimage3"
var random=Math.floor(3*Math.random());
document.write("<style>");
document.write("#header {");
document.write(' background:url("' + image[random] + '") no-repeat top left;');
document.write(" }");
document.write("</style>");
</script>

7. Klik Simpan.

Keterangan :::

Untuk kode di atas, yang berwarna hitam adalah URL dari gambar anda, sedangkan yang berwarna merah adalah jumlah dari gambar yang anda submit.

Anda bisa menambah jumlah gambar yang di submit dengan cara menambahkan kode ::
image[3]="urlimage3"

image[4]="urlimage4"

image[5]="urlimage5" 

dst

.

.

Tapi dengan syarat, angka berwarna merah harus sama dengan jumlah gambar yang anda sumbit.

Perlu anda ingat, gambar yang anda masukkan harus sesuai dengan ukuran header blog anda. 
Untuk mengetahui berapa ukuran header anda, bisa dicari melalui Rancangan>>Edit Html.
Lalu tekan Ctrl+F dan ketikkan header, maka anda akan menemukan data header anda. Carilah kode width="XXXpx", nilai XXX itulah lebar header anda.
misalnya :: 
#header {
width:660px;  
margin:0 auto 10px;
border:1px solid #ccc;
}

Maka lebar header anda adalah 660 Px. 

anda bisa menggantinya selebar gambar anda.

misalnya, gambar yang akan anda submit mempunyai lebar 980 Px, dan tinggi 250 Px.

kode tersebut bisa anda rubah menjadi seperti berikut ::

#header {
width:980px;
height:250px;
margin:0 auto 10px;
border:1px solid #ccc;
}

lalu Simpan, dan lihatlah hasilnya....
terima Kasih...