Java Web Media | Web Design Company Based in Depok

Membuat CMS PHP MySQL Menggunakan Dreamweaver CC, CS6, CS5, CS4, CS3 (Part 13) – Installasi Text Editor TinyMCE

Anda memasuki Part 13 dari rangkaian tutorial Pembuatan Aplikasi CMS/Berita sederhana. Pastikan Anda mengikuti tutorial-tutorial Part 1-Part 12 di bawah ini:

Java Web Media | Web Design Company Based in Depok
Java Web Media | Web Design Company Based in Depok
  1. Membuat Site Definition di Dreamweaver CS5, dan
  2. Membuat koneksi database PHP MySQL dengan Dreamweaver CS5
  3. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 1)
  4. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 2)
  5. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 3)
  6. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 4)
  7. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 5)
  8. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 6)
  9. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 7)
  10. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 8.) 
  11. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 9)
  12. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 10)
  13. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 11)
  14. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 12)
  15. Source code Tutorial CMS Dreamweaver Part 12

TinyMCE adalah salah satu teks editor yang cukup banyak digunakan dalam proses pembuatan website, utamanya terkait dengan penggunaan form textarea. Nah, dalam tutorial ini Anda akan belajar menambahkan fasilitas teks editor tersebut ke dalam aplikasi yang telah Anda buat sampai Part 12 (silakan baca: Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 12).

Mendownload TinyMCE

Aplikasi text editor dapat Anda download secara langsung di http://www.tinymce.com/download/download.php. Anda bisa mendownload versi TinyMCE 4.0.16 development package. Silakan download langsung di http://download.moxiecode.com/tinymce/tinymce_4.0.16_dev.zip.

Java Web Media | Kursus Web Desain dan Web Programming
Java Web Media | Kursus Web Desain dan Web Programming

Langkah persiapan TinyMCE

Setelah mendownload TinyMCE, berikut langkah-langkah persiapannya:

Java Web Media | Web Design Course Depok, Bekasi, Jakarta
Java Web Media | Web Design Course Depok, Bekasi, Jakarta
  1. Copy file tinymce_4.0.16_dev.zip tersebut ke dalam folder admin. Pilih Extract Here.
  2. Ekstrak file tersebut di dalam folder admin
  3. Langkah persiapan telah selesai

Menginstall TinyMCE di form tambah berita (add-news.php dan edit-news.php)

Java Web Media | Web Design Course DKI Jakarta
Java Web Media | Web Design Course DKI Jakarta
Java Web Media | Web Design Company Based in Depok
Java Web Media | Web Design Company Based in Depok

Langkah selanjutnya adalah installasi TinyMCE yang telah Anda download.

  1. Buka file add-news.php dengan Dreamweaver Anda
  2. Sebelum kode </head> (penutup head), berada di sekitar baris 170, tekan Enter sebanyak tiga kali. Untuk lebih jelasnya lihat gambar di atas
  3. Tambahkan kode berikut ini:
    <script src="tinymce/js/tinymce/tinymce.min.js"></script>
    <script>
     tinymce.init({selector:'textarea'});
    </script>
  4. Simpan kembali file add-news.php
  5. Lakukan pengetesan melalui browser Anda. Hasil akhir bisa dilihat pada gambar di bawah ini.
Java Web Media | Web Design Company Based in Depok
Java Web Media | Web Design Company Based in Depok

Langkah selanjutnya, dengan cara yang sama Anda dapat menambahkan fasilitas teks editor TinyMCE ini di halaman edit-news.php

Anda telah berhasil menginstall TinyMCE sebagai teks editor di website Anda.

Java Web Media: Web Design di Kota Depok

Java Web Media adalah perusahaan yang bergerak di bidang web design, web programming, web application, web education, graphic design dan graphic education yang berbasis di kota depok.

15 thoughts to “Membuat CMS PHP MySQL Menggunakan Dreamweaver CC, CS6, CS5, CS4, CS3 (Part 13) – Installasi Text Editor TinyMCE”

  1. halo kak, mau tanya nih kan di bagian berita msih pke kyk view.php?=id bla bla kalo mau pke clean url gmn cara implikasinya thanks.

  2. thankyou bgt tutornya…
    ane modif2 source codenya smpe bisa nampilin gambar…
    edit gambar juga
    smpe chatting

    komplit bgt
    klo kurang masih bisa diutak atik lagi cssnyaa

  3. Min, cara buat script untuk php seperti :

    Selamat datang “Nama username yang login” anda telah login sebagai ” Nama user yang login “.

    Caranya gimana ya min ? Help me, min

  4. mas tolong di rply ya .. saya sdh berhasil mulus jaya .. dan saya sdh kembangkan sendri termasuk templatenya .. skarng sya mw tnya mas .. gmna klau saya mw membuat bnyak user yg bisa mengupload berita .. tapi setiap filenya cuman bisa diliat dan diedit oleh penulis masing” gimna ya ????

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.