WelCome in My NotePad

.

Minggu, 05 Februari 2012

Membuat GIF / Gambar melayang Pada BLog.

Buat sobat yang masih belum mengerti tentang gambar melayang pada blogspot, berikut saya jelaskan secara singkat. 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 sobat pakai di posisi gambar melayang ini, tapi counter, Status YM, iklan dan lain-lain.



Ok, buat sobat yang ingin mencoba tips ini, silahkan ikuti tutorial berikut ini, tapi sebelumnya back up dulu templatesobat agar jika terjadi kesalahan dan template blog sobat tidak rusak. Berikut step-step yang harus sobat lakukan :

  1. Log ini ke akun blogger sobat;
  2. Pilih menu Rancangan » Edit HTML;
  3. Beri tanda centang pada tulisan Expand Template Widget;
  4. Carilah kode ]]></b:skin>. setelah jumpa, sisipkan kode berikut ini tepat diatasnya. Eh iya pilih salah satu kode dari 4 pilihan posisi dibawah ini, jangan dicopy semuanya. Maksudnya misalnya anda memilih "posisi kiri atas", maka gambar melayang akan ada disebelah kiri atas layar
Posisi Kiri atas: #Aztiafk  { 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); } #Aztiafk a  img {border:0}; 

Posisi Kanan Atas: #Aztiafk  { 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); } #Aztiafk a  img {border:0} 

Posisi Kiri Bawah: #Aztiafk  { 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); } #Aztiafk a  img {border:0} 

Posisi Kanan Bawah:  #Aztiafk { 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); } #Aztiafk a  img {border:0} 
  1. Selanjutnya carilah kode </body>, kalau sudah ketemu maka letakkan kode dibawah ini tepat diatasnya;
<div id="Aztiafk">
<a href="http://www.aztiafk.co.cc/" target="_blank">
<img src="http://gifs.gifbin.com/1047444azmp81le1x.gif"/></a>
</div>
Kode diatas silahkan diedit dulu, warna merah ganti dengan alamat target halaman yang kamu inginkan, sedangkan warna biru adalah alamat gambar/gif yang ingin dipasang.

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

Selamat mencoba, semoga berhasil.
 NB. Untuk Mmasukan gambar Hanya tinggal Merubah smua kata " gif  " (tanpa tanda kutip) Menjadi " jpg " (tanpa tanda kutip)

1 komentar:

  1. Membuat Gif / Gambar Melayang Pada Blog. ~ Azti™ >>>>> Download Now

    >>>>> Download Full

    Membuat Gif / Gambar Melayang Pada Blog. ~ Azti™ >>>>> Download LINK

    >>>>> Download Now

    Membuat Gif / Gambar Melayang Pada Blog. ~ Azti™ >>>>> Download Full

    >>>>> Download LINK 4u

    BalasHapus

IP