Tutorial WEB | Cara Upload Gambar di Editor TinyMCE - Hallo sahabat Rumah Musafir Ilmu, Pada Artikel yang anda baca kali ini dengan judul Tutorial WEB | Cara Upload Gambar di Editor TinyMCE, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel blog, Artikel Blogger, Artikel Materi Kuliah, Artikel pendidikan, Artikel website, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Tutorial WEB | Cara Upload Gambar di Editor TinyMCE
link : Tutorial WEB | Cara Upload Gambar di Editor TinyMCE

Tutorial WEB | Cara Upload Gambar di Editor TinyMCE

Salah satu fitur unggulan dalam editor WYSIWYG adalah Upload Gambar, karena kita bisa mengupload gambar yang langsung bisa ditampilkan didalam TextArea, asyiknya lagi tidak hanya satu gambar yang bisa di upload, namun boleh beberapa gambar sekaligus. Disamping itu, kita juga bisa memberikan ALT (Alternative Text) pada gambar untuk keperluan SEO dan letak gambar pun bisa diatur posisinya (Center, Left, Right).



Jadi, sekarang langsung saja kita mulai cara mengupload gambarnya:

• Masuk dulu ke halaman Administrator CMS Lokomedia, lalu klik menu/modul Berita.
• Selanjutnya, klik tombol Tambah Berita, maka akan tampil Form Tambah Berita.
• Kemudian isi Judul Berita dan data lainnya, karena disini saya akan langsung ke WYSIWYG yang terletak pada Isi Berita. Silahkan isi teks pada paragraf pertama, lalu tekan tombol Enter di keyboard, maka kursor berada di paragraf kedua (1). Lihat pada gambar berikut:

• Selanjutnya, klik ikon bergambar pohon di toolbar (2), maka akan tampil kotak dialog Insert/Edit Image, kemudian klik tombol Browse. Lihat gambar berikut:

• Maka akan tampil kotak dialog KCFinder:/image. Kemudian klik tombol Upload, lalu cari file gambar yang mau di upload, misalnya logo-ajax.jpg, kalau berhasil di upload akan terlihat seperti pada gambar berikut:

• Selanjutnya, klik 2x pada gambar logo-ajax.jpg, maka akan dibawa kembali ke kotak dialog Insert/Edit Image, silahkan isi Image Description (boleh tidak di isi), lalu klik tombol Insert. Lihat gambar berikut:

• Maka gambar sudah tampil di TextArea Isi Berita, tepatnya pada baris kedua. Lihat gambar berikut:

Jika Anda ingin mengupload beberapa gambar lagi juga boleh, silahkan ulangi langkah 3 s/d 7, dalam contoh ini saya memasukkan dua gambar lagi. Kalau sudah selesai, silahkan klik tombol Simpan untuk menyimpan berita ke database. Adapun hasilnya dapat dilihat melalui halaman pengunjung, tepatnya detail beritanya, contohnya pada gambar berikut:

Catatan Penting:

• File-file gambar yang di upload melalui KCFinder akan tersimpan di folder tinymcpuk/gambar.
• Apabila nama file gambar yang di upload sudah ada, maka secara otomatis KCFinder akan memberikan nama lain untuk gambar tersebut, misalnya logo-ajax.jpg sudah ada, maka secara otomatis apabila Anda mengupload gambar dengan nama yang sama, maka nama filenya logo-ajax(1).jpg, artinya gambarnya sebelumnya masih ada dan tidak tertimpa dengan gambar yang sama nama filenya.
• Gambar tidak akan tampil apabila dijalankan secara offline atau localhost, tapi jangan khawatir karena data dan gambarnya tetap tersimpan informasinya didalam database, sehingga kalau suatu saat di online-kan maka gambarnya akan tampil, atau lebih idealnya sih posting berita serta gambarnya dalam keadaan online, sehingga gambarnya langsung tampil,

Demikianlah Artikel Tutorial WEB | Cara Upload Gambar di Editor TinyMCE

Sekianlah artikel Tutorial WEB | Cara Upload Gambar di Editor TinyMCE kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Tutorial WEB | Cara Upload Gambar di Editor TinyMCE dengan alamat link http://bismillah-go.blogspot.com/2012/06/tutorial-web-cara-upload-gambar-di.html