Nusagatizen

Cara Menggunakan TinyMCE Editor

TinyMCE Editor merupakan librari untuk mengubah tampilan elemen HTML sendandar menjadi sebuah editor yang memiliki beberapa fitur seperti perataan halaman, heading, bullet numbering, insert ling, insert gambar, dan lain sebagainya.

Ada beberapa cara untuk menggunakan TinyMCE editor di dalam project website kita. Pertama, kita bisa menggunakan CDN TinyMCE yang telah disediakan oleh situs resmi TinyMCE. Kedua, kita bisa download librari TinyMCE dan menyertakan ke dalam paket projek kita.

TinyMCE bisa digunakan dengan gratis dengan fitur setandar. Namun, jika ingin menggunakan fitur-fitur yang lebih banyak, kita bisa upgrade ke paket premium dengan harga $0.40/bulan, paket pro seharga $1.0/bulan, dan paket enterprise sesuai kebutuhan.

Cara Menggunakan TinyMCE Editor

Pertama, kita harus menyertakan librari TinyMCE ke dalam dokumen yang akan menggunakannya. Pada tutorial ini digunakan librari dari CDN. Tambahkan kode di bawah ini di dalam kode <head> atau sebelum penutupnya </head>

<script src="//cloud.tinymce.com/stable/tinymce.min.js"></script>

Kedua, buat sebuah input atau textarea yang akan diubah menjadi TinyMCE Editor. Contoh:

<textarea id="editor">Contoh yang akan dirubah menjadi Editor TinyMCE</textarea>

Ketiga, menerapkan editor kedalam textarea. Buat Javascript dan masukkan kode seperti di bawah ini:

<script>tinymce.init({ selector:'textarea' });</script>

Penerapan editor dengan kode javascript di atas akan merubah semua textarea yang ada di dalam halaman tersebut berubah menjadi editor TinyMCE. Jika ingin menerapkannya hanya di editor tertentu, kita bisa mengganti selector dengan id. contoh:

<script>tinymce.init({ selector:'#editor' });</script>

Contoh script di atas akan mengubah textarea yang memiliki id editor saja yang diterapkan TinyMCE.


Cara Menghilangkan Menubar TinyMCE

Secara default, TinyMCE menampilkan menubar File, Edit, View, dan Format beserta sub menunya. Jika kita ingin menghilangkan menubar tersebut caranya cukup mudah, tinggal menambahkan opsi menubar: false di dalam kode java script yang kita gunakan. Contoh:

Hasil eksekusi kode di atas akan tampak seperti demo di bawah ini:

Cara Menambahkan Plugin di TinyMCE

Secara default, plugin yang dipanggil oleh TinyMCE adalah undo, redo, pemformatan (Format), Perataan (Text Align), dan Indentasi. Jika kita ingin menambahkan plugin lainnya maka harus menambahkan opsi plugin beserta value nama pluginnya dipisah dengan spasi. Contoh:

Hasil eksekusi kode di atas akan tampak seperti demo di bawah ini:

Cara Mengubah Bahasa TinyMCE

Secara default, TinyMCE akan ditampilkan dalam bahasa Inggris (EN_US). Jika kita ingin menampilkan editor dalam bahasa Indonesia maka harus menambahkan opsi language di dalam konfigurasi TinyMCE tersebut.
Contoh:

Hasil eksekusi kode di atas akan mengubah bahasa Editor menjadi bahasa Indonesia dan tampak seperti di bawah ini.

Cara Mengambil kontent dari TinyMCE

Cara mengambil konten dari editor TinyMCE adalah sebagai berikut:

Demo:



Tahukah Kamu Arti cair?

ca·ir a 1 bersifat seperti air, tidak padat dan tidak berupa gas: air raksa ialah benda --; 2 bersifat tidak kental (tidak pekat, tidak beku); encer: bubur --; larutan yang --; 3 ki bocor (tentang rahasia, berita, atau kabar); 4 ki (sudah) dapat diuangkan (tentang surat keputusan untuk memakai uang negara dari kas negara atau Kantor Perbendaharaan Negara); 5 ki lemah (kurang giat, kurang bersemangat); 6 Fis fase zat yang molekulnya secara relatif bebas mengubah kedudukannya satu terhadap yang lain, tetapi terkendala oleh gaya kohesif untuk mempertahankan volumenya yang relatif tetap;

men·ca·ir v 1 menjadi cair (encer): larutan yang mengental itu kini telah ~ kembali karena panas; 2 ki luluh; baik kembali (tidak marah lagi): hati istrinya telah ~ dan pelan-pelan ia menghampiri suaminya; 3 ki berubah menjadi bentuk lain: perang dingin kini ~ menjadi gugatan lisan; 4 ki pulih menjadi baik; tidak tegang lagi (tentang hubungan persahabatan): betulkah hubungan kedua negara itu sekarang sudah ~ ?; 5 ki memperoleh pemecahan atau jalan keluar (tentang perundingan yang hampir menemui jalan buntu);

men·ca·ir·kan v 1 menjadikan cair; mengencerkan; 2 ki memulihkan (tentang hubungan persahabatan): negara itu tidak akan segera ~ hubungan dengan negara yang pernah berkonfrontasi dengannya; 3 ki menjadikan kenyataan (seperti menguangkan dana); merealisasikan: tanpa tanda tangan ketua, ia tidak dapat ~ dana tersebut; 4 ki memperbolehkan diambil kembali (simpanan uang di bank): pihak bank sudah setuju untuk ~ simpanan itu;

ca·ir·an n benda cair; larutan; hasil mencairkan;~ antisepsis Kim cairan atau larutan yang menghambat timbulnya infeksi dan berkembangnya mikroorganisme pada jaringan tubuh yang luka akibat kecelakaan; ~ gas bumi Pet cairan yang didapat dari gas alam (seperti kondensat, gas minyak cair, bensin alam); ~ pengencer bahan atau zat yang berupa cairan untuk memperbanyak volume dan berfungsi sebagai pelindung, sumber nutrisi, bakteriostatik, dan mempertahankan keasaman;

ce·ca·ir·an n Fis (golongan) benda cair; barang yang cair: ~ seperti selai;

pen·ca·ir·an n 1 proses, cara, perbuatan mencairkan; 2 Tek proses pengubahan batu bara menjadi bentuk akhir berupa bahan cair melalui proses gasifikasi
Selengkapnya...

Ahmad Budairi

Seorang blogger yang bekerja menjadi freelancer di bidang bahasa pemrograman. Baca biografi Ahmad Budairi atau kunjungi lapaknya di Fiverr. Kontak via email: [email protected]. Hubungi via 0822 2500 5825

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Close