<p>CKEditor adalah sebuah plugin yang fungsinya untuk memudahkan kita dalam mengedit text ketika membuat sebuah artikel/tulisan. Jika anda pernah pengguna<a href="https://www.tutorialpedia.net/cara-membuat-website-profesional/"> wordpress self hosting</a> akan ada sebuah tool untuk mengedit text pada bagian atas. Nah itulah yang disebut dengan text editor (WYSIWYG) <em>What You See Is What You Get. </em>Lalu bagaimana cara integrasikan ckeditor pada sebuah <a href="https://www.tutorialpedia.net/10-contoh-desain-form-login-keren-dengan-bootstrap/">halaman web</a> yang akan kita bangun dengan platform JSP <em>(Java Server Pages) </em>? Caranya sangat mudah sekali, anda bisa mengikuti panduannya berikut ini:</p>
<div class="bacajuga">
<div class="titlebaca"><strong>Baca Juga:</strong></div>
<div class="contentbaca">
<ul>
<li><a href="https://www.tutorialpedia.net/login-multi-level-dengan-servlet-dan-jsp/" target="_blank">Login Multi Level Pada JSP</a></li>
<li><a href="https://www.tutorialpedia.net/tutorial-lengkap-cara-membuat-web-sederhana-dengan-java/">Cara membuat web dengan java</a></li>
<li><a href="https://www.tutorialpedia.net/contoh-penggunaan-ajax-jquery-pada-servlet-dan-jsp/">Contoh Penggunaan AJAX JQuery dengan Servlet dan JSP</a></li>
</ul>
</div>
</div>
<div class="partner-banner-aftc-baca-juga" style="text-align: center; margin-top: 30px;"></div>
<h3><strong>Requirements:</strong></h3>
<ol>
<li>CKEditor. <a class="fasc-button fasc-size-xsmall fasc-type-flat ico-fa fasc-ico-before fa-sign-out" style="background-color: #109d58; color: #ffffff;" href="http://ckeditor.com/download" target="_blank" data-fasc-style="background-color:#109d58;color:#ffffff;">Download</a></li>
</ol>
<h3><strong>Cara Mudah Integrasikan CKeditor di JSP</strong></h3>
<p>Setelah anda mengunduh ckeditor, copy paste folder ckeditor pada project aplikasi anda, pada tutorial ini saya meletakkan folder <strong>ckeditor </strong>pada folder <strong>plugin </strong>yang sebelumnya telah saya buat.</p>
<p><a href="https://www.tutorialpedia.net/wp-content/uploads/Screenshot_19.png"><img class="aligncenter size-full wp-image-2971" src="https://www.tutorialpedia.net/wp-content/uploads/Screenshot_19.png" alt="integrasikan ckeditor di jsp" width="355" height="244" /></a></p>
<p>Buat file jsp baru dengan nama <strong>CKEditor.jsp </strong> lalu letakkan kode berikut ini di dalam tag head. fungsi dari script ini adalah kita akan memanggil script ckeditor.</p>
<pre class="lang:default decode:true "><;script type="text/javascript" src="plugin/ckeditor/ckeditor.js">;<;/script>; 
</pre>
<p>Jika anda meletakkan folder <strong>ckeditor </strong>pada direktori yang berbeda, jangan lupa untuk mengubah bagian <strong>src </strong>sesuai direktori ckeditor anda.</p>
<p>Lalu buat sebuah textarea dengan <strong>id=&#8221;editor&#8221; </strong>seperti berikut ini:</p>
<pre class="lang:default decode:true"><;p>; 
 <;label for="editor">;Editor:<;/label>; 
 <;textarea cols="80" id="editor" name="editor" rows="10">;<;/textarea>; 
<;/p>;</pre>
<p>Sekarang kita akan mereplace textarea tersebut dengan ckeditor melalui fungsi replace berikut ini:</p>
<p>Letakkan di atas <;/body>;</p>
<pre class="lang:default decode:true "><;script type="text/javascript">; 
 CKEDITOR.replace( 'editor' ); 
<;/script>;</pre>
<p>Sekarang simpan semua perubahan dan jalankan <strong>CKeditor.jsp </strong>pada browser. Maka hasilnya akan seperti berikut ini:</p>
<p><a href="https://www.tutorialpedia.net/wp-content/uploads/Screenshot_20.png"><img class="aligncenter size-full wp-image-2972" src="https://www.tutorialpedia.net/wp-content/uploads/Screenshot_20.png" alt="integrasi ckeditor di jsp" width="865" height="387" /></a></p>
<p> ;</p>
<p>Live Demo:<br />
<iframe width="100%" height="400" src="//jsfiddle.net/fikryans10/mrxd3cwh/embedded/result/" allowfullscreen="allowfullscreen" frameborder="0"></iframe></p>
<p>Pada prinsipnya untuk menginstegrasikan ckeditor <em>(cleint-side)</em> pada sebuah laman cara yang digunakan sama saja.</p>
<p> ;</p>
<p>Cara diatas bisa juga anda terapkan pada bahasa pemrograman laiinya seperti PHP dan ASP.</p>
<p>Demikian tutorial <strong>Cara Mudah Integrasikan CKeditor di JSP (Java Server Pages)</strong></p>
<p> ;</p>

Cara Mudah Integrasikan CKeditor di JSP (Java Server Pages)
Recent Articles
Kumpulan DNS Gratis Tercepat!
DNS merupakan sebuah sistem yang bertugas menyimpan semua informasi data domain dalam jaringan. Dengan adanya DNS, domain atau hostname yang ada akan ditranslate dan...
Apa itu DNS ? Dan Fungsinya
Apa itu DNS? - DNS (Domain Name System) adalah sebuah sistem yang bertugas menyimpan semua informasi data domain dalam jaringan. Dengan adanya DNS, domain...
Apa itu OLT ? Serta Fungsinya Dalam Jaringan
Apa itu olt ? OLT (Optical Line Termination) adalah perangkat keras yang berfungsi sebagai titik akhir (end-point) dari layanan jaringan optik pasif (Passive Optical...
Template Voucher Untuk Mixradius
Template Voucher Untuk Mixradius - Pasti kalian bosen kan dengan template voucher default mixradius? tenang. kali ini saya akan memberikan template untuk voucher mixradius kamu agar...
Daftar Port Game Online Mikrotik Terbaru
Daftar port game online dibawah ini bisa digunakan untuk membuat rule agar koneksi ke game online tersebut bisa lancar, bisa juga untuk memisahkan antara...
