Trial And Eror

Knowledge Is Free..!
Start Working Smart, Not Hard
Start Sharing, Not Selling

Sunday 14 December 2014

Cara memasang TinyMCE sebagai Text Editor di WEB Anda

TinyMCE adalah Aplikasi Text Editor berbasis WEB seperti MS - WORD yang memberikan ruangan POSTING dengan tampilan WYSWYG (What You See Is What You Get).

Semua blog tentu memiliki halaman kolom posting textarea yang simple menyerupai MS-Word. Dengan bantuan alat ini kita dapat menambah ukuran font, dapat melakuan penggantian paragraf dan lain sebagainya. Fasilitas pendukung textarea berbasis WYSWYG ini memang cukup banyak. Bermodalkan Ajax/Javascript, fasilitas ini benar-benar enak digunakan. Contoh selain TinyMCE adalah Rte dan FckEditor.

OK saya tidak akan berpannjang Lebar langsung sajah cara pemasangannya :

  1. Pertama - tama download dulu TinyMCE
  2. Setelah Download langsung saja ekstrack di folder manapun

    Setelah Itu Ambil/CUT folder yang sudah di lingkari merah ke folder WEB atau disitu sajah diamkan
  3. Bikin file HTML lalu masukin ke folder sederajat sama folder TinyMCE
  4. Masukan Kode dibawah ini ke file HTML yang tadi Anda buat
    <html>      
               <title>Tutorial Menggunakan TinyMCE di dalam web PHP</title>            
    <head>                    
    <script type="text/javascript" src="tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
        selector: "textarea"
        });
    </script>
    </head>
    <body>
    <form method="post" action="somepage">
        <textarea name="content" style="width:100%"></textarea>
    </form>
    </body>
    </html>
  5. Buka File HTML tersebut:
  6. Jika ingin memasang Full tools TinyMCE ganti script yang bewarna merah dengan ini :
    Memasang Full tools Tiny MCE :
    <script type="text/javascript">
    tinymce.init({
        selector: "textarea",
        theme: "modern",
        plugins: [
            "advlist autolink lists link image charmap print preview hr anchor pagebreak",
            "searchreplace wordcount visualblocks visualchars code fullscreen",
            "insertdatetime media nonbreaking save table contextmenu directionality",
            "emoticons template paste textcolor colorpicker textpattern"
        ],
        toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
        toolbar2: "print preview media | forecolor backcolor emoticons",
        image_advtab: true
    });
    </script>
  7. Hasil
  8. Selesai

#KnowledgeIsFree

Cara memasang TinyMCE sebagai Text Editor di WEB Anda
Item Reviewed: Cara memasang TinyMCE sebagai Text Editor di WEB Anda 9 out of 10 based on 10 ratings. 9 user reviews.

11 comments:

Followers

Translate

Copyright © Trial And Eror | Powered by Blogger

Design by Anders Noren | Blogger Theme by NewBloggerThemes.com