Thursday 4 August 2016

nn

Membuat Text Editor dengan Bootstrap dan Jquery

Hallo...
Semangat Pagi !

Kali ini saya posting tentang text editor nihh.. Sedikit cerita ya, dari kelas XI saya udah pengen tau kodenya dan pengen bisa buat text editor seperti gambar di bawah, tapi gak tau kenapa baru kali ini, saat saya berada di BLC. Saya baru menemukan kode dan cara membuat text editor. Haha... perjuangan yang hampir satu tahun.


Yuk simak !

Pengertian
Text editor adalah sebuah tool tambahan yang memiliki banyak fitur, dan membantu memberi format penulisan posting yang ingin kita tulis.

Latar Belakang
Sangat membantu, jika dalam membuat posting artikel menggunakan tool-tool dalam Text Editor.

Alat dan Bahan
1. Komputer atau Laptop
2. Sublime text atau text editor lainnya.

Tahap Pelaksanaan
 1. Tahap pertama, download terlebih dahulu bootstrapnya, jika sudah mempunyai bootstrap, berarti tidak usah mendownload. Download bootstrap di sini 
2. Download juga jquernya, Download Jquery Text Editor disini
3. Tuliskan kode berikut ini, pastikan berada di dalam tag <body>..</body>


     <script type="text/javascript" src="assets/ckeditor/ckeditor.js"></script>
     <label>Input Berita Terkini</label>
                              <section class="panel">
                                      <div class="form">
                                          <form action="#" class="form-horizontal">
                                              <div class="form-group">
                                                  <div class="col-sm-10">
                                                      <textarea class="form-control ckeditor" name="editor1" rows="6"> </textarea>
                                          </form>
                                      </div>
                                      <button></button>
                              </section>



 4.  Simpan dengan ekstensi html ataupun php. Lalu buka di browser anda, dan lihat hasilnya.

Referensi
 -

Penutup 
Terimakasih telah berunjung di blog saya hari ini, sampai jumpa di postingan selanjutnya.
Selamat mencoba dan selamat belajar !

nn

About nn -

Author Description here.. Nulla sagittis convallis. Curabitur consequat. Quisque metus enim, venenatis fermentum, mollis in, porta et, nibh. Duis vulputate elit in elit. Mauris dictum libero id justo.

Subscribe to this Blog via Email :