Cara Memasang dan Menggunakan Tinymce Text Editor di Website

hendriyudhape - Para blogger pasti tau dengan Tinymce. Tinymce adalah sebuah text editor yang biasanya digunakan di website php. Seseorang yang ingin kemudahan saat membuat posting di web agar seperti pada saat menulis postingan di blogger atau wordpress pasti akan memasang dan menggunakan Tinymce text editor ini ke dalam websitenya.

Nah bagaimana cara untuk memasang dan menggunakan Tinymce text editor di website html atau php ??

Jawabannya bisa anda temukan di bawah ini. Memasang editor teks Tinymce di textarea PHP tidaklah sulit, anda hanya perlu mengikuti tutorial cara memasang dan menggunakan Tinymce text editor di bawah ini.

Langkah Pertama

Buat script html seperti di bawah ini.

<html>
<title>Tutorial Menggunakan TinyMCE di dalam web PHP</title>
<head></head>
<body>
<table>
<tr>
<td>Judul</td>
<td>:</td>
<td><input type="text" name="Judul"></td>
</tr>
<tr>
<td>Kategori</td>
<td>:</td>
<td><input type="text" name="Kategori"></td>
</tr>
<tr>
<td>Deskripsi Artikel</td>
<td>:</td>
<td><textarea name="Deskripsi Artikel"></textarea></td>
</tr>
</table>
</body>
</html>

Script di atas akan menjadi seperti di bawah ini :

Langkah Kedua

Anda harus mempunyai Tinymce terlebih dahulu. Anda bisa download di sini Free Download Tinymce Text Editor Website PHP. Setelah anda mendownloadnya lalu extract file tersebut di sebuah folder. Jika sudah di extract lalu folder tinymce tersebut anda pindahkan ke folder yang berisi script html di atas tadi.

Langkah Ketiga

Taruh Script ini ke dalam <head>

<script type="text/javascript" src="tinymce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",
theme : "advanced",
});
</script>

Satu hal yang perlu anda perhatikan adalah src="tinymce/tiny_mce.js" karena sourcenya menurut nama folder yang anda buat. Di bawah ini adalah contoh menaruh script di atas (langkah ketiga) ke dalam <head>

<html>
<title>Tutorial Menggunakan TinyMCE di dalam web PHP</title>
<head>
<script type="text/javascript" src="tinymce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",
theme : "advanced",
});
</script>
</head>
<body>
<table>
<tr>
<td>Judul</td>
<td>:</td>
<td><input type="text" name="Judul"></td>
</tr>
<tr>
<td>Kategori</td>
<td>:</td>
<td><input type="text" name="Kategori"></td>
</tr>
<tr>
<td>Deskripsi Artikel</td>
<td>:</td>
<td><textarea name="Deskripsi Artikel"></textarea></td>
</tr>
</table>
</body>
</html>

Lalu jadilah seperti di bawah ini :