Skip to content

Instantly share code, notes, and snippets.

@nazarbek7

nazarbek7/index.html

Created April 6, 2020 05:43
Show Gist options
  • Save nazarbek7/2ab5aaee01a0f838c04c9f51edb60597 to your computer and use it in GitHub Desktop.
Save nazarbek7/2ab5aaee01a0f838c04c9f51edb60597 to your computer and use it in GitHub Desktop.
Download ZIP
Summernote wysiwyg test
Raw
index.html
<div class="editor-wrapper">
<div id="editor" class="editor"></div>
</div>
Raw
script.js
$(document).ready(function() {
$("#editor").summernote({
height: 300, // set editor height (toolbar not included???)
focus: false, // set focus to editable area after initializing summernote
toolbar: [
// [groupName, [list of button]]
["style", ["bold", "italic", "underline", "clear"]],
["font", ["strikethrough", "superscript", "subscript"]],
["fontsize", ["fontsize"]],
["color", ["color"]],
["para", ["ul", "ol", "paragraph"]],
["height", ["height"]],
['insert', ['link', 'picture']]
]
});
});
Raw
scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote.js"></script>
Raw
style.css
.editor-wrapper{
width: 600px;
height: 400px;
box-shadow: 3px 0 10px black;
margin: 0 auto;
}
Raw
styles
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment