November 01, 2010

Membuat Gambar Melayang di Blog

Gambar melayang adalah gambar yang letaknya selalu tetap dan tidak terpengaruh oleh scrool mouse. Maksudnya kita dapat membuat gambar seperti melayang di kanan, kiri, bawah, atas walaupun Scrollbar ditarik kemana-mana. Dan bukan hanya gambar yang bisa Anda pakai di posisi gambar melayang ini, tapi counter, Status YM, iklan dan lain-lain.









Sebelumnya back up dulu template Anda, agar jika terjadi kesalahan dan template blog Anda tidak rusak. Berikut step-step yang harus sobat lakukan :




  1. Login ke Acount blogger anda.
  2. Masuk pada Pengaturan.
  3. Pilih Tata letak.
  4. Pilih Edit html.
  5. Cari kode ini ]]></b:skin> truz copy paste kode di bawah ini di atas kode ]]></b:skin> .(tekan ctrL+f lalu ketikkan kode yg kita cari untuk mempercepat pencarian)




#melayang {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }


Berikutnya cari lagi di dalam template anda kode </body>  Kemudian copy pastekan code dibawah ini dan letakkan diatas kode </body>.(tekan ctrL+f lalu ketikan kode yang kita cari untuk mempercepat pencarian)


<div id='melayang'>
<a href='http://ifoell.blogspot.com/'>
<img border='0' src='http://i437.photobucket.com/albums/qq96/bloganakbangsa/benderamerahputih.gif'/></a></div



Simpan, Selesai deh....




Keterangan :


  • Kode yang tercetak merah (bottom dan left) menunjukan letak gambar. Letak gambar dapat di ubah dengan mengganti kode tersebut (left=kiri, bottom=bawah, right=kanan, top=atas) sesuai dengan keinginan Anda.
  • Kode yang berwarna merah silahkan diganti dengan url blog Anda sebagai link dan url tempat gambar anda disimpan, misal : di photobucket, di imageshack, di flickr, dll.




Semoga sukses!!!!
Happy blogging....

0 komentar:

Posting Komentar

Design by : Sponsored by: