Berikut ini adalah contoh sederhana penggunaan TinyMCE pada halaman HTML. Pastikan untuk memasukkan script TinyMCE dan mengonfigurasi editor sesuai dengan kebutuhan Anda.
- Mengunduh TinyMCE:
Unduh versi TinyMCE terbaru dari situs resminya atau gunakan versi dari CDN (Content Delivery Network). Berikut adalah contoh menggunakan CDN:
<!-- Include TinyMCE from CDN --> <script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
2. Menyiapkan TextArea untuk Editor:
Tambahkan elemen <textarea> di mana Anda ingin menempatkan editor.
code<textarea id="myTextarea"></textarea>
3. Inisialisasi dan Konfigurasi TinyMCE:
Inisialisasikan dan konfigurasikan TinyMCE dengan menambahkan script berikut setelah tag <textarea>.
<script> tinymce.init({ selector: '#myTextarea', plugins: 'link image code', toolbar: 'undo redo | formatselect | bold italic | alignleft aligncenter alignright | code', height: 300, menubar: false }); </script>
Dalam contoh ini, kita mengaktifkan plugin ‘link’, ‘image’, dan ‘code’, serta menentukan beberapa item toolbar yang muncul. Anda dapat menyesuaikan konfigurasi sesuai kebutuhan Anda.
4. Jalankan pada Server atau Sistem
Pastikan skrip ini dijalankan pada server atau sistem manajemen konten yang mendukung penggunaan TinyMCE, seperti WordPress, Drupal, atau Joomla.
Berikut adalah contoh lengkap penggunaan TinyMCE pada halaman HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TinyMCE Example</title>
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
</head>
<body>
<textarea id="myTextarea"></textarea>
<script>
tinymce.init({
selector: '#myTextarea',
plugins: 'link image code',
toolbar: 'undo redo | formatselect | bold italic | alignleft aligncenter alignright | code',
height: 300,
menubar: false
});
</script>
</body>
</html>
Pastikan untuk menyesuaikan konfigurasi sesuai kebutuhan dan integrasikan dengan sistem atau aplikasi web Anda.
