Pages

Friday, June 1, 2012

Cara Memasukkan Gambar pada Joomla 2.5

Dalam memasukkan (posting) artikel/konten website yang dibangun dengan Joomla, hampir tidak mungkin kita tidak akan memasukkan gambar di dalam website tersebut. Gambar-gambar itu baik sebagai logo, header, foto produk maupun gambar yang menjadi ikon suatu artikel atau konten. Yang akan dibahas disini adalah memasukkan gambar sebagai gambar pada artikel/konten. Pada artikel sebelumnya, penulis telah membahas bagaimana memasukkan artikel pada Joomla 2.5, namun belum dijelaskan cara memasukkan gambar. Ada beberapa cara yang dapat dilakukan. Untuk mulai memasukkan gambar, silahkan login ke administrator Joomla Anda, lalu klik Add New Article dan tampilannya kira-kira sebagai berikut:


Jika gambar yang akan kita masukkan ada pada suatu halaman web, cara yang dilakukan di antaranya:

1. Menggunakan Tag html
Misalnya url gambar yang dimaksud adalah http://naskah.net/indonesia.jpg, maka tag html-nya adalah sebagai berikut:

<img src="http://naskah.net/indonesia.jpg" border="0"/>.

Cara Memasukannya klik toolbar HTML pada editor Joomla Anda, dan tampilannya seperti gambar berikut:


Ketikkan tag HTML pada HTMLSource Editor, seperti tampak pada gambar berikut:


Klik Update, dan pada editor akan tampak seperti gambar berikut:

Tampak bahwa gambar berhasil dimasukkan pada editor.

2. Menggunakan Toolbar Insert/Edit Image
Memasukkan gambar dengan menggunakan toolbar Insert/Edit Image hanya dapat dilakukan jika gambar yang akan dimasukkan adalah gambar pada suatu halaman web (ada url gambarnya). Misalnya Url gambar yang dimaksud adalah seperti pada Nomor 1, maka untuk memasukkan gambar tersebut, klik pada Insert/Edit Image (jika belum mengetahui toolbar pada Joomla, baca artikel sebelumnya), dan akan tampil gambar berikut:

Keterangan gambar:
  • Image Url, yaitu alamat url gambar misalnya pada tutorial ini http://naskah.net/indonesia.jpg.
  • Image Description, yaitu deskripsi/keterangan mengenai gambar yang akan kita masukkan, misalnya pada tutorial ini penulis memasukkan Bendera Indonesia.
  • Alignment, yaitu tata letak gambar. Ada beberapa pilihan tata letak yakni Not Set (Tidak diatur), Top (atas), dan lain-lain
  • Dimensions, yakni dimensi/ukuran gambar (lebar x tinggi gambar).
  • Border, semacam bingkai pada gambar yang diukur dengan angka.
  • Vertical Space, yakni spasi membujur
  • Horizontal space, yakni spasi mendatar.
Perhatikan gambar berikut:


Selanutnya klik Insert untuk memasukkan gambar, dan hasilnya seperti tampak pada gambar berikut:


3. Menggunakan Panel Image
Jika gambar yang akan kita masukkan masih berada pada komputer kita, kita dapat mengunggah tersebut ke web hosting baik menggunakan Control Panel Hosting maupun Melalui FTP, setelah itu lakukan langkah nomor  1 dan 2 di atas. Namun kita dapat juga menggunakan Panel Image yang terdapat pada bagian Editor-TinyMCE pada Joomla 2.5. Klik pada Panel Image dan akan muncul gambar berikut:


Kita juga dapat memasukkan gambar yang ada dalam web hosting pada langkah ini. Tampak pada gambar beberapa gambar yang terdapat pada web hosting  atau administrator Joomla. Selain itu kita juga dapat memasukkan gambar melalui alamat url gambar. Jika ingin memasukkan gambar yang ada pada komputer, klik Browse dan setelah mendapatkan gambar klik Start Upload dan beberapa saat gambar akan segera masuk pada editor dan gambar tersebut juga akan tersimpan pada web hosting atau administrator Joomla Anda.

4 komentar:

  1. aku sudah sesuai langkah2 tsb, tetapi kenapa gambarnya tdk muncul. yang muncul di artikel frontend hanya deskripsi image nya doang ada yang tahu kenapa? aku pakai joomla 2.5.6. mhn pencerahannya.

    ReplyDelete
  2. Kini belajar tak perlu jauh2 kesana kemari , cukup belajar dirumah apalagi ditemani tentor kaffah college.... caranya mudah tinggal hubungi 085 799 192 783 kami yang datang kerumah kamu, biaya terjangkau, all mapel insya allah bermanfaat

    ReplyDelete
  3. I've been browsing online more than 3 hours these days, but I never found any interesting article like yours. It is beautiful worth sufficient for me. Personally, if all webmasters and bloggers made excellent content as you did, the web will likely be much more useful than ever before.

    Here is my website - acheter follower
    my website > acheter followers twitter

    ReplyDelete
  4. bgm ya caranya agar gamabar bisa center pd saat di tampilkan di halaman web??

    ReplyDelete

Silahkan tinggalkan komentar Anda. Jangan menyertakan url/nama domain dalam isi komentar. Komentar Anda sebaiknya berhubungan dengan artikel yang dibahas. Url/blog yang mengandung unsur pornografi, pornoaksi, obat-obatan/resep obat, perdagangan senjata api/tajam, yang berhubungan dengan download MP3/MP4/Video, atau url/blog/website yang melanggar serta yang melakukan SPAM termasuk blog/web yang membajak isi dalam website ini tanpa menyertakan url www.naskah.net akan dihapus.