loading...

Cara Pasang Image di Sudut Blog

Salah satu trik blogger agar blog kelihatan tambah menarik adalah memasang image di sudut blog. Pemasangan image bisa di atas kiri, atas kanan, bawah kiri, dan bawah kanan. Selain itu trik ini juga dapat dimanfaatkan untuk fungsi yang lain, sesuai dengan apa yang kamu inginkan. Sebab kalau disebutin kebanyakan...

Tanpa ba..bi..bu.. lagi, langsung kita mulai trik memasang image di sudut blog :

  • Login ke account blogger kamu.
  • Pilih Tata Letak --> Edit HTML.
Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

  • Tambahkan kode berikut di atas kode ]]></b:skin>.

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

  • Ganti kode yang berwarna merah dengan posisi image yang kamu inginkan (ex : top=atas, bottom=bawah, right=kanan, left=kiri). Dan atur kode yang berwarna hijau sesuai dengan tampilan di blog kamu.

  • Kemudian tambahkan kode ini di atas kode </body>.

<div id='anima_sudut'>
<a href='http://optimasi-blog.blogspot.com/'>
<img alt='' border='0' src='http://i647.photobucket.com/albums/uu191/ariamsi/disiniann.gif'/></a>
</div>


  • Ganti kode yang berwarna merah dengan alamat blog dan alamat penyimpanan image kamu.
  • Jangan lupa disimpan

Selamat mencoba pasang image di sudut blog...

96 komentar untuk “Cara Pasang Image di Sudut Blog”

  1. satu lagi tambah ilmu dari kang OB . . . bisa dicoba and thanks banget ya . . .

    jangan lupa backlink punya aku. .heehehhe

    BalasHapus
  2. keren mas... nantilah kalau ada waktu...saya belajar lagi.... Maklum lagi Deadline Majalah

    BalasHapus
  3. makasih ilmunya mas....
    langsun ane praktekin...

    BalasHapus
  4. hahaha.. tengkyu tengkyu.. salwa here :)>-

    BalasHapus
  5. to all: sami-sami, tapi jangan lupa, kapan-kapan berkunjung kembali yaa... :D

    BalasHapus
  6. sumpah,,,blog q jd tambah keren,,makasi bozzzzzzzz

    BalasHapus
  7. Mantapp banget mas,, thanks yah

    BalasHapus
  8. to ardyan & ReMo-XP: thanks, friends. Akan lebih banyak tips dan trik lagi, jika sobat-sobat pada rame ngunjungi ini blog...

    BalasHapus
  9. ok bang OB udah ku praktikin neh keren hasilnya.. tnx yak...;):D

    BalasHapus
  10. Aduh terima kasih banyak nih mas OB... :)

    BalasHapus
  11. makasih ya atas postingnya, mo di coba ah

    BalasHapus
  12. lumayan lengkap...
    makasih sob...;;)

    BalasHapus
  13. kode /b:skin ada di bagian mna yah ? ada yang bisa bantu ? klik http://mzvha.blogspot.com
    makasi :)

    BalasHapus
  14. to mznha: klo tidak salah, blog mba menggunakan template klassik. Jadi ngga keliatan, tp mungkin kode </b:skin> sama fungsinya dengan kode </style>

    BalasHapus
  15. Akhirnya ketemu juga caranya, khan keren kl ada di blog :D

    BalasHapus
  16. Artikelnya bermanfaat banget nie...
    Trims bwt infonya ya...;)
    Salam kenal,
    Angwie
    (pendiri situs beritakita-angwie.blogspot.com)

    BalasHapus
  17. Trimakasih tipsnya, ada yang mo tak tanyakan nih :

    kalo buat image-nya di 2 tempat kiri-kanan apa harus nambahin kode yang sama diatas ]]></b:skin> tadi..???

    kunjungi blog-ku ya http://lolidsonline.blogspot.com/

    BalasHapus
  18. keren neh artikel nya..mohon bimbingannya:D

    BalasHapus
  19. to Lolids Here: untuk menambah image di sudut yang lain, maka buat lagi kumpulan kode CSS anima_sudut dengan nama yang berbeda ex: anima_sudut1, anima_sudut2, dst. Kemudian tambahkan pula kode di atas </body>. Caranya mengganti kode div id='anima_sudut' dengan nama yang sesuai dengan CSS yang kamu tambahkan

    BalasHapus
  20. akhirnya dapet juga jawabannya setelah mencari cari

    BalasHapus
  21. TOLONG LIHAT BLOG SAYA DONG BISA NGGAK BLOG SAYA DI MODIP BIAR KEREN N BANYAK PENGUNJUNG WWW.BISNIS-HP-DAHSYAT.BLOGSPOT.COM MAKACIIIIIIIIIIIIIIIIIIIIIIIIIH BUANYAAAAAAAAAAAAAAAAAAK.... TAK TUNGGU LHOOOOO

    BalasHapus
  22. Oh ya lupa sampean ini pakai template apa kayaknya sederhana namun rapi bersih....=))

    BalasHapus
  23. to SUNARDI: Pakai template "minima green Fragmentary", ingin lebih tahu infonya silakan kunjungi http://www.zoomtemplate.com/2009/05/minima-green-fragmentary.html

    BalasHapus
  24. tx banget sob,,,
    postingan ni membantu,,,

    BalasHapus
  25. Makasih banyak yaa...
    tolong dong bikinin blog yang bagus

    BalasHapus
  26. klo dpake di wordpress gmana dong...???..pasti bisa dong.. b-( ??

    BalasHapus
  27. kalo di pasang script bisa gak yah?

    BalasHapus
  28. ko tak bisa ya kang OB.. :((
    jawabannya tutup semua dengan benar :-/
    piyee ya.. :-?

    BalasHapus
  29. maen ke blogku dumz.
    hhu..huu..higz..higz..
    gagal nii.http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif

    BalasHapus
  30. terima asih banyak kang....
    bisa buat di blogku

    BalasHapus
  31. Thanks om. udh bagi bagi ilmunya...:D

    BalasHapus
  32. makasih bgt y mas atas tutorialnya.jangan lupa backlink ya mas

    BalasHapus
  33. makasih infonya bermanfaat banget buat akang yang masih belajar blogging pake blogspot. btw, main dong ke http://www.kanghanif.co.cc

    BalasHapus
  34. terima kasih udah terpasang, lihat blogku kalo gak percaya. Tapi bisa nggak ya diisi warna selain putih....?

    BalasHapus
  35. MAKASIH BANG ATAS ILMUNYA JAYA TERUS INDONESIA

    BalasHapus
  36. Koko said
    Thanks ata informasinya
    Salam untuk semua BLOGGER

    BalasHapus
  37. Makasih tutorial memasang image di sudut blog nya sobat...

    BalasHapus
  38. makash y mz atas infonya... aq akan coba nanti

    BalasHapus
  39. Recent Visitorsnya udah saya pasang, dan berhasil. Tapi wuaadduh susahnya. pertama sih gak berhasil, bikin penasaran, setelah dicoba dan dicoba lagi, eh.... gak tahunya di account MBL-nya yang gak benar. Makasih ya

    BalasHapus
  40. numpang koment...minta ijin copas yak...
    tengkyu...???

    BalasHapus
  41. mantappppp............siph.....tengkiuuuuu^^

    BalasHapus
  42. kereeeen gan!!! :D

    silakan blogwalking k tempat saia

    http://akirawisnu.blogspot.com

    BalasHapus
  43. gambar gif...
    nggak web2.0 bgt ah :)

    BalasHapus
  44. salam balik, abna-aulad.blogspot.com, blognya tak pasang.

    BalasHapus
  45. Thx ya infonya salam kenal jagang lupa klik di http://blogharriz.blogspot.com ya!!!

    BalasHapus
  46. keren....
    dicoba n berhasil.........
    teng kyu....

    BalasHapus
  47. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  48. Berhasiel..!!,Terima Kasih Banyak
    :))

    BalasHapus
  49. ~x( gak bisaaaaaaaaaaaa..... aku bego..... :((
    http://ilmu-komputernya.blogspot.com/

    BalasHapus
  50. kang, tu klu mau taroh d tengah gmna.jd pas center d tengah...Q otak atik kok g bisa ya....
    mohon bantuanya kang...

    BalasHapus
  51. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  52. itu kok cm bs satu sih?kl dua gitu gimana caranya?

    BalasHapus
  53. infonya sangat bagus, makasih yah, mas

    BalasHapus
  54. kalo dipasang form subcriber di sudut kayak pasang gambar bisa gak bos??

    BalasHapus
  55. @Dela yuntuk menambah image di sudut yang lain, maka buat lagi kumpulan kode CSS anima_sudut dengan nama yang berbeda ex: anima_sudut1, anima_sudut2, dst. Kemudian tambahkan pula kode di atas </body>. Caranya mengganti kode div id='anima_sudut' dengan nama yang sesuai dengan CSS yang kamu tambahkan

    BalasHapus
  56. @kaos couple dicoba aja, mas. Sebab OB belum pernah coba, mudah-mudahan bisa

    BalasHapus
  57. waw...mantep mas,,,,sip dah tak pasang di blog saya juga yo...tankki

    BalasHapus
  58. trim .... kasih.....kank?aq wes isoooooooo..........adddeeeeemmmmm rasa ne..........hikz ghikz=))=))=))=))

    BalasHapus
  59. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  60. misi misi,,, aqu ijin plagiat "cara pasang ini" nya ya pak,, heeee

    BalasHapus
  61. Wah...Kerenn.. Thx gan.. ane dah nyoba, langsung tok cer, bisa muncul gambarnya..

    BalasHapus
  62. NICE bgt kk...
    ijin sedot triknya y....
    sy kasi smber link nya kk...tq ;))

    oh y cara biar ada tulisan "cara pasang ini" gmn kk??

    BalasHapus
  63. @Rizhardy Cara pasang link-teks "Cara Pasang ini" di bawah anima, cukup dengan menambahkan link-nya di atas </div> pada kode HTML anima_sudut, contoh :
    <div id='anima_bawah'>
    <a href='http://optimasi-blog.blogspot.com/'>
    <img alt='tips seo dan trik blogger' border='0' src='http://i647.photobucket.com/albums/uu191/ariamsi/disiniann.gif'/></a><br/>
    <a href='http://optimasi-blog.blogspot.com/2009/03/cara-pasang-image-di-sudut-blog.html' title='trik blogger'>Cara pasang ini</a>
    </div>

    BalasHapus
  64. iya bagus ne mas.. sayang kecepatan load blogku jadi lama.. but btw thanks a lot ya mas infonya.. ;;)

    BalasHapus
  65. ehhh mmpir ke blok aq dong aq gi trget pny 100 knjungan
    aq gi dftr ggle adsnse
    yayayayayaaaa.....please

    BalasHapus
  66. @Rani R Tyas : Lambatnya loading mungkin bukan karena masang trik ini kk Rani, kecuali ukuran image-nya besar.

    @Muhammad arfans : Udah beberapa kali mampir, kk arfans. Mungkin hanya butuh komentarnya, kk. he..he..

    BalasHapus
  67. sangat informatif Sob..lanjutkan..sukses selalu!

    BalasHapus
  68. WIH...
    wajib di coba ni....
    maksih kang...
    salam kenal ja ya...

    BalasHapus
  69. terima kasih mas. maklum saya ini blogger baru. jadi tutorial seperti ini adalah yang paling saya cari… :)

    Lihat juag:
    Cara Memasang Star Rating di Blog

    BalasHapus