Cara membuat gambar melayang disudut blog

Cara membuat gambar melayang dipojok halaman blog?? Ya, pernahkah anda melihat gambar maupun animasi disebelah kiri layar blog? Inilah yang kita maksudkan diatas. Kali ini kita akan membahas bagaimana cara membuatnya.
Pertama-tama anda harus memiliki gambar atau animasi yang akan ditampilkan diblog anda nantinya. Silahkan desain terlebih dahulu, lalu upload ke image hosting anda, di internet banyak sekali yang tersedia gratis contohnya : photobucket.com, imageshack.com, flickr.com. Untuk tipe file terserah anda, baik jpg, gif, png, dll.

Ok, setelah gambar yang anda desain atau anda dapatkan silahkan simpan url link gambar tersebut terlebih dahulu. Nah, untuk langkah selanjutnya silahkan ikuti langkah dibawah ini...

1. Login Acount blogger anda.

2. Masuk pada Rancangan atau tata letak.

3. Edit html.

4. Silahkan cari code ]> < /b:skin >

5. Kemudian copy code dibawah ini dan paste di atas kode ]> < /b:skin >

#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); }

Keterangan : Kode yang tercetak warna hijau ( 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.

6. Berikutnya cari lagi di dalam template anda kode < /body > Kemudian copy pastekan code berikut ini dan letakkan diatas kode tersebut.

<div id='melayang'>
<img src='Url-link-gambar'/></a>
</div>

 Ket : kode yang berwarna hijau diganti dengan url tempat gambar anda disimpan.

7. Setelah di copy langsung SIMPAN template anda, dan lihat hasilnya..

Mudah bukan?? Ok, Selamat mencoba.. :)

Artikel Terkait