Perbandingan WYSIWYG Editor

Salam para web programmer,

Beberapa hari yg lalau saya iseng buat polling teks editor yg digunakan member grup PHP Indonesia. Hasilnya kaya gini:

WYSIWYG editor pilihan member group PHP Indonesia

WYSIWYG editor pilihan member group PHP Indonesia

Klo dilihat sepintas semua milih CKEditor. Tapi biar yakin, saya melakukan perbandingan WYSIWYG Editor yg disebutkan diatas. Saya screenshots menggunakan tablet.

Tentu saja masing2 punya kelebihan & kekurangan masing2. Konsep yg diusung pun berbeda-beda. Jadi saya akan mengkerucutkan kriteria perbandingannya.

  1. Support Mobile Browser, saat ini user banyak mengakses web via gadget. Jadi mobile suport menjadi keharusan.
  2. Floating Toolbar. Setelah mencoba beberapa macam editor, rasanya lebih nyaman dgn toolbar inline. Dimana kita bisa menyeleksi teks, kemudian muncul toolbar di dekatnya. Tak perlu jauh2 mengarahkan kursor ke bagian atas layar. Contohnya seperti Medium.com.

Klo kelengkapan fitur saya rasaΒ tak terlalu menjadi masalah. Karena penulisan di web jarang yg membutuhkan format teks yg rumit. Yg sering dibutuhkan hanya format teks dasar, upload image & embed video youtube.

 

CKEditor

tampilan CKeditor dgn floating toolbar

tampilan CKeditor dgn floating toolbar

tampilan CKEditor pada konten yg panjang

tampilan CKEditor pada konten yg panjang

support inline editor di mobile browser. tapi toolbar tambil di bagian atas atau bawah elemen. untungnya ketika halaman discrool atau terlalu panjang, posisi toolbar bisa menyesuaikan.

 

 

 

 

 

 

 

 

 

TinyMCE

tampilan TinyMCE dgn toolbar menempel diatas elemen. tak bisa mempossisikan diri saat discroll.

tampilan TinyMCE dgn toolbar menempel diatas elemen. tak bisa mempossisikan diri saat discroll.

library ini jg support inline editor di browser. sayangnya posisi toolbar fix diatas elemen. tidak bisa menyesuaikan ketika discrool. klo keser ke bawah toolbar tidak lagi terlihat.

 

 

 

 

 

 

 

Summernote

Tampilan summernote ketika seleksi teks

Tampilan summernote ketika seleksi teks

tampilan summernote ketika toolbar muncul

tampilan summernote ketika toolbar muncul

yg satu ini jg support inline editor tapi sayangnya belum sepenuhnya support mobile browser. Kemaren ketika dicoba tampilannya agak aneh. Ketika ngeblok / seleksi teks toolbar tidak langsung muncul. Tapi ketika di tap lagi di teks tersebut toolbar baru muncul dan sayangnya seleksi teks sudah berubah jadi kursor. Jadinya tidak bisa meneerapkan format teks yg diinginkan. Sebenarnya fitur floating toolbarnya keren, paling keren. Karena bisa muncul pas di dekat posisi kursor.

Redactor

Redactor gagal menampilkan toolbar di mobile browser

Redactor gagal menampilkan toolbar di mobile browser

sayangnya library yg katanya keren ini belum support mobile browser. toolbarnya tidak muncul sama sekali πŸ™

 

 

 

 

 

 

 

 

TrumboWYG

tollbar inline tak support mobile browser

tollbar inline tak support mobile browser

yg ini jg belum support mobile πŸ™

 

 

 

 

 

 

 

 

Froala

toolbar inline tak bisa tampil di mobile browser

toolbar inline tak bisa tampil di mobile browser

toolbar gak muncul πŸ™

 

 

 

 

 

 

 

 

 

Medium Editor

Medium editor tidak support mobile browser

Medium editor tidak support mobile browser

library ini meniru platform medium.com, nyaman digunakan di browser. Tapi sayangnya belum support mobile πŸ™

 

 

 

 

 

 

 

Markdown

tampilan markdown teks editor

tampilan markdown teks editor

Klo yg satu ini support di mobile. Tapi kode markdown-nya agak ribet digunakan orang awam.

 

 

 

 

 

 

 

Text Angular

tampilan text angular di mobile browser

tampilan text angular di mobile browser

Klo yg ini belum bisa inline editor. Toolbarnya fix disitu.

 

 

 

 

 

 

 

 

CLEditor

CLEditor tidak support mobile browser

CLEditor tidak support mobile browser

yg satu ini sama sekali tidak support mobile browser maupun inline editor. klo tap di textarea, hanya berkedip saja. keyboard android langsung menghilang. tidak bisa ngetik sama sekali.

 

 

 

 

 

 

 

jqTE

JQuery Text editor tidak support inline editor

JQuery Text editor tidak support inline editor

klo yg ini jalan di mobile, tapi tidak bisa inline editor.

 

 

 

 

 

 

 

 

Kesimpulan

Awalnya saya berharap dengan Medium Editor dgn konsep kesederhanaan ditambah toolbar yg menempel diatas seleksi teks. Tapi sayangnya tidak support mobile browser sama sekali. Summernote bisa menampilkan toolbar serupa tapi sedikit bermasalah dgn seleksai teks.

Jadi dengan fitur yg ada saat ini yg paling bisa dijadikan pilihan cuma CKEditor.
setidaknya sampai Medium Editor & Summernote memperbaiki supportnya ke mobile.

Sekian reviewnya, semoga bermanfaat πŸ™‚