HTML Editor Live Preview Source by Emmet & Codemirror

You should read this CodeMirror and this Emmet! Fasilitas dari 2 web tersebut sama AA Koben di bungkus menjadi sebuah live HTML preview Basicly seperti live HTML editor Seperti biasa, gue menambahkan beberapa embed page .html & addons codemirror.Jika melihat penampilan memang biasa-biasa saja. Tetapi memang itu tujuan saya, terlihat sederhana dan lebih menitikberatkan kepada fungsi editor itu sendiri :P

Color

Tombol color gue masukan embed page color dari www.jswidget.com/lab/canvas-based-color-picker.html

UnCSS

Tombol unCSS generator untuk membuat tampilan kode CSS agar lebih terbaca, ane terapkan CSS unminifier by Peter Coles mrcoles.com/blog/css-unminify
Untuk tombol Doc and Reload adalah tombol bonus yg bisa sobat baca & coba sendiri ;)

HTML editor ini menggunakan syntax dari emmet dan codemirror. Sobat bisa menulis dengan gaya bahasa emmet (tombol Doc) Fitur operasional Koben sisipkan beberapa dari Codemirror, antara lain:

>> Syntax Highlighter sudah tentu ada.
>> Match highlighter ( codemirror.net/demo/matchhighlighter.html )
>> Tag matcher ( codemirror.net/demo/matchtags.html )
>> Search/Replace ( codemirror.net/demo/search.html )

Jika sobat mau pasang addons dari codemirror lagi, silahkan saja kalau memang bisa :D codemirror.net/demo
Koben akan kasih gratis apps ini, syaratnya cuma satu saja. Tolong sebarluaskan sejauh-jauhnya tools ini agar blogger Indonesia pada pinter semua :) Untuk customize tinggi dan lebar, buka folder css ► buka pada notepad file style.css Ubahlah width and hight pada kode .CodeMirror 'n #preview

Shortcut page emmet by brettterpstra.com/2012/11/16/emmet-for-cheaters

DOWNLOAD:
Via Ziddu www.ziddu.com/download/23363409/Editor.zip.html
Via 4shared www.4shared.com/zip/ht5k-pVb/Editor.html
Happy blogging \m/