30 Oktober 2010

Perbesar / Perkecil ukuran gambar di blog dengan kode script

sampel_perbesarkecil_gambar

Gambar bagi sebuah blog memang dibutuhkan. Baik itu sebagai accessories blog maupun sebagai illustrator bagi tulisan. Di area postingan, ukuran gambar mungkin tidak menjadi soal, karena tersedianya ruang yang cukup luas untuk menempatkan gambar dan juga pengaturannya pun sangat mudah, tinggal kik and click.

Caranya setelah gambar berhasil diupload, kemudian klik gambar tersebut dan akan muncul menu untuk mengatur gambar.  Namun pengaturannya hanya dibatasi 5 ukuran saja yaitu small, medium, large, x-large dan original size.

Memang walau hanya 5 ukuran saja tapi sudah cukup mewakili dan membantu kita khususnya untuk gambar yang akan dipasang di dalam postingan.

Bagiamana jika ingin membuat gambar menjadi ukuran yang sesuai dengan kemauan kita? Seperti misalnya ingin membuat gambar dengan ukuran panjang 100px dan tinggi 80px.

Untuk memperbesar atau memperkecil ukuran gambar, tidak perlu repot-repot mengedit pakai software editor image tetapi dengan menggunakan kode script kita dapat mengatur ukuran gambar sesuai keinginan kita.

Gambar yang akan dipasang di halaman blog tentu harus melalui proses upload terlebih dahulu. Setelah gambar selesai diupload maka akan didapat link gambar sebagai berikut:
<img src='URL gambar">
Apabila ingin membuat gambar tadi menjadi link yang mengarah ke blog anda, maka susunannya menjadi :
<a href='URL Blog Anda'><img src='URL gambar "></a>

Dari susunan kode seperti tersebut di atas, gambar yang muncul masih menampilkan ukuran yang sebenarnya. Sehingga bila tempat yang tersedia di blog lebih sempit dari gambar akan menimbulkan masalah baru.

Cara mengatasinya, gambar harus diatur.  Kode yang diperlukan adalah kode weight dan height (weight=lebar, height=tinggi).
Sedangkan penempatan kodenya seperti ini :

<img src='URL gambar' width='100' height='80'>

atau bila ingin membuat gambar tadi menjadi link yang mengarah ke blog anda, maka susunannya menjadi :
<a href='URL Blog Anda'><img src='URL gambar' width='100' height='80'></a>

Catatan:
Untuk mengatur (memperbesar/memperkecil) ukuran gambar, ubahlah angkanya sesuai yang dikehendaki.

Dengan cara itu, gambar yang akan dipasang di blog dapat kita perbesar / perkecil dengan menggunakan kode script.

4 komentar:

  1. Info yang sangat bermanfaat,nanti aku praktekan..!!
    Salam kenal dari Kertek Wonosobo.!

    BalasHapus
  2. @Prapatan Kertek,terima kasih atas kunjungannya,
    salam kenal juga.

    BalasHapus
  3. Makasih kiriman emailnya,berguna sekali untuk saya.
    Salam kenal,salam erat persahabatan!

    BalasHapus

Catatan: Hanya anggota dari blog ini yang dapat mengirim komentar.