• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Jaranguda

Belajar Mengajar

  • Home
  • Sponsor/Jasa
  • Tentang

Menambah TinyMCE kedalam Textarea PHP HTML

Last Updated on 20 September 2017 By tommy Leave a Comment

TinyMCE adalah HTML WYSIWYG editor, sehingga untuk mengetikkan teks menambah huruf tebal, miring, dan yang lainnya menjadi sangat mudah, dan hasilnya bila disimpan kedalam database otomatis dalam format tag html, sehingga memudahkan membantu dalam mengedit kalimat.

Buat sebuah form dengan HTML, misalkan berisi judul, subjudul dan artikel.

<html>
	<title>Tutorial Menambah TinyMCE kedalam PHP</title>
<head></head>
<body>
<table>
<tr>
	<td>Judul</td>
	<td>:</td>
	<td><input type="text" name="judul"></td>
</tr>
<tr>
	<td>subjudul</td>
	<td>:</td>
	<td><input type="text" name="subjudul"></td>
</tr>
<tr>
	<td>Artikel</td>
	<td>:</td>
	<td><textarea name="artikel"></textarea></td>
</tr>
</table>
</body>
</html>

Tampilan form diatas
form html
Sebelum menambahkan TinyMCE kedalam form yang kita gunakan, download terlebih source codenya dari download page
Ekstrak file yang baru anda download, lalu letakkan di folder yang sama dengan form HTML diatas. Lalu panggil dari form diatas dengan cara menambahkan diantara code

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

pada bagian mode diatas adalah untuk merubah tampilan textarea menjadi semacam text editor, untuk lengkapnya bisa dibaca di Wiki Configuration TinyMCE.
Code lengkap untuk script diatas adalah

<head>
<html>
	<title>Tutorial Menambah TinyMCE kedalam PHP</title>
<head>
<script type="text/javascript" src="tinymce/jscripts/tiny_mce/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>subjudul</td>
	<td>:</td>
	<td><input type="text" name="subjudul"></td>
</tr>
<tr>
	<td>Artikel</td>
	<td>:</td>
	<td><textarea name="artikel"></textarea></td>
</tr>
</table>
</body>
</html>

lihat perbedaannya setelah di tambahkan TinyMCE seperti gambar dibawah ini
tinymce html php

Last Updated on 20 September 2017 by tommy

Tulisan menarik lainnya

  • Menambah Teks Kedalam Gambar dengan PHP

    Di PHP terdapat library GD yang memungkinkan untuk memanipulasi gambar, tetapi pastikan library GD sudah…

  • Convert Markdown ke HTML dengan PHP

    Convert/Konversi dari markdwon ke HTML dengan PHP sangat mudah dengan bantuan library Parsedown. Kita akan…

  • Membuat Script Kontak Form dengan PHP

    Dengan menambahkan kontak form di website yang dibuat, bisa menjadi alternative untuk berkomunikasi dengan pemilik…

  • Feed Reader Sederhana dengan PHP

    Untuk parsing data feed dari website, kita akan menggunakan SimplePie. Download terlebih dahulu SimplePie dari…

Filed Under: PHP Tagged With: html, tinymce

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Pencarian

Tanya Jawab tentang DevOps SRE CPE, gabung di https://t.me/devopsindonesia

Terbaru

  • Cara Menonaktifkan Pager di macOS
  • Cara Mengupdate Nama Apple silicon-as-a-Service Scaleway
  • Cara Force Delete Namespace di Kubernetes
  • Install PHP MariaDB di Mac Monterey
  • MacOS Minta Install Git

Komentar

  • Ari on Cara Mematikan SSID Molecool Balifiber
  • kiki anarki on Mengambil Data dari Situs BPJS Ketenagakerjaan dengan PHP cURL
  • musgan on Password Router Huawei HG8245H5 Indihome
  • ghabily on Mengambil Informasi Router Alcatel Lucent G-241W-A dengan PHP
  • nea on Mencari urutan angka yang hilang di PHP

Tulisan Populer

  • Password Router Huawei HG8245H5 Indihome 1.1m views
  • Password Terbaru ZTE F609 Indihome 784k views
  • Password Superadmin Huawei HG8245A 314k views
  • Cara Setting Manual Modem GPON ZTE F609 Indihome 272.2k views
  • Cara Setting Wireless ZTE F609 Indihome 256k views
  • Mengaktifkan Port LAN di Huawei HG8245 Indihome 169k views
  • Akses UseeTV Indihome via Wireless ZTE F609 156.5k views
  • Kemana Menghilangnya Saldo BCA 50 ribu 150.1k views
  • Cara Reset Password ZTE F609 Indihome 147.2k views
  • Cara Setting DHCP Server Modem/Router ZTE F609 112.8k views

Kategori

  • Delphi
  • dll
  • Gambas
  • Internet
  • Java
  • Lazarus
  • Linux
  • PHP
  • Review
  • Teknologi

Sponsor

kadal.id
carakami.com
kuotabisa.com
Untuk jadi sponsor, hubungi kita lewat halaman sponsor
© 2021. Jaranguda
  • Linux
  • PHP
  • Internet
  • Teknologi
  • Delphi
  • Gambas
  • Java