Summernote

pure

by Eugene Manager

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.8/summernote.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.8/summernote.css">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css">
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>
<div id="summernote">Hello Summernote</div>

CSS

body { padding:40px; }

JavaScript

$('#summernote').summernote({
    height: 300,
    toolbar: [
        // [groupName, [list of button]]
        ['img', 
        	['picture']],
        ['style', 
        	['style', 'addclass', 'clear']],
        ['fontstyle', 
        	['bold', 'italic', 'ul', 'ol', 'link', 'paragraph']],
        ['fontstyleextra', 
        	['strikethrough', 'underline', 'hr', 'color', 'superscript', 'subscript']],
        ['extra', 
        	['video', 'table', 'height']],
        ['misc', 
        	['undo', 'redo', 'codeview', 'help']]
    ]
});