Membuat Gambar Melayang di Samping Blog

Sobat Blogger ngg Asikk ya klo pagi-pagi di hari weekend malah hujan, gak seru-gak seru...hehehe.

Saling kunjungi mengunjungi Blog (Blogwalking) memang sangat dan berguna sekali misalnya ada kaitanya dengan SEO,di samping itu juga untuk mempererat tali persaudaraan kita semua,ia gak sobat, atau bisa jadi malah blog kita menjadi inspirasi pagi pengunjungnya.

contohnya tadi pagie ketika saya sedang browsing",saya tertarik dengam gambar melayang-layang yang berada di samping kanan dan kiri blog,nach pada kesempatan kali ini saya akan memberikan Tutorial tengang Cara Membuat Gambar Melayang di Blog.

Jika Sobat tertarik untuk mencobanya atau untuk sekedar mempercantik tampilan blog, caranya sangat-sangat mudah, disini saya akan memberikan 2 cara untuk membuatnya :

Cara Pertama :

1. Login ke Blogger.
2. Kemudian klik [Rancangan] > [Tambah Widgets].
3. Pilih widgets “HTML/JavaScript “.
4. Copy dan pastekan kode dibawah ini:
   
   Posisi Bawah Kanan :
   <div style="display:scroll;position:fixed;bottom:0;right:0;"><a href="http://www.dutaxp.blogspot.com/" target="_blank">Letakan Kode gambar atau Script disini</a></div>
   
   Posisi Atas kanan :
   <div style="display:scroll;position:fixed;top:0;right:0;"><a href="http://www.dutaxp.blogspot.com/" terget="_blank">Letakan Kode gambar atau Script disini</a></div>
   
   Posisi Bawah Kiri :
   <div style="display:scroll;position:fixed;bottom:0;left:0;"><a href="http://www.dutaxp.blogspot.com/" terget="_blank">Letakan Kode gambar atau Script disini</a></div>
   
   Posisi Atas Kiri :
   <div style="display:scroll;position:fixed;top:0;left:0;"><a href="http://www.dutaxp.blogspot.com/" target="_blank">Letakan Kode gambar atau Script disini</a></div>
5. Kemudian SAVE 

Keterangan :
• Anda bisa mengganti huruf yang dicetak merah dengan URL gambar dan URL blog.
• Trick ini tidak akan berjalan di browser IE.

Cara Kedua :

1. Login ke Blogger.
2. Kemudian klik [Rancangan] > [Tambah Widgets].
3. Beri tanda centang pada tulisan Expand Template Widget;
4. Cari kode ]]></b:skin>. 
5. Letakan kode berikut ini tepat diatasnya.
6. Pilih salah satu kode berikut ini sesuai keinginan sobat :

Posisi kiri atas :
#dutaxp_melayang { top:10px; left:10px; position:fixed; _position:absolute; clip:inherit; _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth – offsetWidth); } #dutaxp_melayang a img {border:0};

Posisi kanan atas :
#dutaxp_melayang { top:10px; right:10px; position:fixed; _position:absolute; clip:inherit; _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth – offsetWidth); } #dutaxp_melayang a img {border:0}





Posisi kiri bawah :
#dutaxp_melayang { bottom:10px; left:10px; position:fixed; _position:absolute; clip:inherit; _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth – offsetWidth); } #dutaxp_melayang a img {border:0}

Posisi kanan bawah :
#dutaxp_melayang { bottom:10px; right:10px; position:fixed; _position:absolute; clip:inherit; _top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth – offsetWidth); } #dutaxp_melayang a img {border:0}





5. Selanjutnya carilah kode </body> 
6. Letakan kode dibawah ini tepat diatasnya;

<div id="dutaxp_melayang"><a href="http://dutaxp.blogspot/"target="_blank">Letkan Gambar atau Script Sobat disini.</div>


Kode diatas silahkan diedit dulu, warna merah ganti dengan alamat target halaman yang kamu inginkan

Perlu di Ketahui !!
Kode ini hanya berlaku untuk 1 posisi, jika sobat ingin memasang di banyak sisi menggunakan kode ini, silahkan sobat ganti ID dari setiap kode.
Contoh :
misalnya sobat ingin memasang di sudut kanan atas, maka yang perlu sobat ganti adalah kode #dutaxp_melayang dengan kode yang sobat inginkan, misalnya bisa saja sobat ganti dengan #dutaxp_melayang_kanan_atas atau apa saja yang penting kode ID antara kedua kode sama.