Hari ini :


Membuat Gambar Melayang di Blog


Ternyata ada juga blogger yang masih bingung tentang cara membuat gambar melayang di blogspot. Buktinya ada pesan di buku tamu dari Sdr.Ucup (kimura_cs@yahoo.com). "Maaf mau tanya, klo nampilin gambar bendera itu gmn? boleh minta codenya. Kirim ke email saya ya..?". Gambar bendera pada blog ini maksudnya gambar melayang yang ada di sudut bawah blog. Jadi, inti yang ditanyakan gimana cara membuat gambar melayang di blog. Padahal tutorialnya banyak ya?, dari yang berbahasa inggris, hingga berbahasa indonesia. Mungkinkah bahasa tutotialnya kurang di mengerti? Atau si Ucup enggan mengunjungi rumahnya Paman Google? Entahlah.. Yang pasti berikut tutorial ulangnya yang di ambil dari berbagai sumber.


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>

    #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); }
  6. Berikutnya cari lagi di dalam template anda kode </body> Kemudian copy pastekan code dibawah ini dan letakkan diatas kode </body>.

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


Keterangan :
  • Pada langkah 5 : 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.
  • Pada langkah 6 : 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 Bermanfaat ya Sobat..?? Happy Blogging

33 komentar:

  1. terima kasih, artikelnya ....

    ReplyDelete
  2. Wah keren, makasih Mas Ifoel. Gimana kabarnya nih?

    ReplyDelete
  3. @Namira : Salam kenal.. link backnya terpasang
    @Seno : Kabar baik Mas Seno, lama juga ya ngga kesini.. hwahwahwahaha........ happy blogging aja ya..???

    ReplyDelete
  4. terima kasih...atas infonya...salam

    ReplyDelete
  5. thanks ya bg......

    informasi nya keren abiss

    klo mw liat blog aQ ne alamat nya bg

    http://anggi-07.blogspot.com/

    ReplyDelete
  6. good for you...back and add to me...

    ReplyDelete
  7. Boleh di coba tuh..makasih  infonya

    ReplyDelete
  8. blognya keren....salam kenal ya

    ReplyDelete
  9. Wah.. bisa bisa...
    Makasih infonya gan...

    Jangan Lupa mampir di blog aku ya.........
    Kumpulan
    Fakta Unik Dunia

    ReplyDelete
  10. udh akku coba kox gg jadi yaa,, ?
    :(

    ReplyDelete
  11. Sangat bermanfaat...
    Gambar melayangku sukses terpasang
    Thanks :)

    ReplyDelete
  12. blog nya keren mas,... btw,gimana cara bikin layout x ,bikin sendiri ???

    ReplyDelete
  13. cakep artikelnya., mkasih :)

    ReplyDelete
  14. makasih banget nieh...atas infonya

    ReplyDelete
  15. makasih kk .. :D ..
    Script this can work :)

    ReplyDelete
  16. thank buat infonya
    jangan lupa mampir ya...

    ReplyDelete
  17. udah gabung di jss tripler? yang belum sok imvestasi.. pasti untung: look here... http://www.jss3-online.blogspot.com

    ReplyDelete
  18. ah kenapa ya g bisa diterapin diblog koe

    ReplyDelete
  19. hahahha saya ucup ms,, email kimura_cs@yahoo.com telah mati

    ReplyDelete

  20. thanks for all the bloggers for the advice may be useful especially for me personally, generally for all of us, I hope we all launched online business

    Amin .....................
    pengobatan gondok beracun alami

    ReplyDelete

  21. Thank you so much for the info, very interesting information we wait for the next update ^^
    Obat polip kandung empedu tanpa operasi

    ReplyDelete

  22. Thank you friend for the information very helpful at all .. !!
    Obat Polip kandung Empedu Yang Alami

    ReplyDelete

  23. nice article thanks to reading your article to my knowledge has increased and hopefully this article can be useful for everyone :)
    Cara mengobati amandel yang bengkak dan sudah parah

    ReplyDelete

Stop SPAM Comments