<!DOCTYPE html>
<html>
<head>
<title>TINYMCE Test</title>
</head>
<body>
<p><textarea id="html" style="width: 100%; height: 200px;" cols="60" rows="10"><h1>TinyMCE 4 with CodeMirror plugin</h1><p>Click the <strong>&lt;&gt;</strong> button in the toolbar, or <strong>Tools -&gt; Source Code</strong> to edit the HTML code of this document.<br>Note that the cursor position is maintained when you switch from WYSIWYG to HTML source, and vice versa.</p><p><img src="/tinymce/tinymce-logo.png" align="left" /> <img src="/tinymce/codemirror-logo.png" align="right" /></p></textarea></p>
<p><script type="text/javascript" src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script><br />
<script type="text/javascript">
tinymce.init({
selector: '#html',
height: 200,
plugins: 'codemirror',
external_plugins: {
codemirror: "/tinymce/plugins.dev/codemirror/plugin.js"
},
toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | code',
codemirror: {
indentOnInit: true,
path: 'codemirror-3.22',
config: {
lineNumbers: true
}
}
});
</script></p>
</body>
</html>