All demos

The source in CodeMirror

The toolbar's button turns the canvas into its html, to edit by hand. With the codemirror plugin loaded that html is in CodeMirror, highlighted and with line numbers, instead of a plain textarea; the same button brings the canvas back with what you wrote. edit_source: false leaves the button out.

The codemirror-inline plugin puts a tool in the drawer of every row, column, text, element and container, and of the page's plain content: it opens that block's html, the block itself and all that is in it, in CodeMirror where the block was. Apply puts what you wrote in its place.

Edit me as html

Press the code button in the toolbar and this is CodeMirror.

A text, saved as one: a click edits it in tinyMCE.