summernote /summernote

Super Simple WYSIWYG Editor

★ 11,846⑂ 2,246👁 292⑃ 1,229● 3,568▤ 62
JavaScriptCreated 2013-04-27summernote.org
11,846
stars
+0+2+3
2,246
forks
292
watchers
1,229
prs
3,568
issues
62
releases
–
discussions

README

Summernote





Summernote is a JavaScript library that helps you create WYSIWYG editors with a simple and easy-to-use interface. Summernote is licensed under the MIT license and maintained by the community.

Homepage: 

 Why use Summernote?

- Simple and user-friendly: Providing an easy to use, intuitive interface
- Easy to install: Just include the JS/CSS files on your HTML and create a div tag to get started
- Compatible with Bootstrap: Bootstrap 3, 4, and 5
- Rich ecosystem: A wide array of plugins and connectors are available, enhancing functionality and integration options
- Easy image handling: Images are automatically embedded in the content using base64 encoding, eliminating the need for separate image management

 How to Use

Summernote is built on jQuery.

 How to install

 1. Include JS/CSS

Include the following code in the  tag of your HTML:

html










 2. Place a div tag

Place a div tag somewhere in the body tag. This element will be replaced with the summernote editor.

html
Hello Summernote


 3. Initialize Summernote

Finally, initialize Summernote with the following JavaScript:

javascript
$(document).ready(function() {
  $('summernote').summernote();
});


For more examples, please visit the project website.

 API

Summernote provides a set of APIs. For example, you can use the following code to get the HTML source code underlying the text in the editor:

javascript
var html = $('summernote').summernote('code');


For more detail about the APIs, please refer to the documentation.

 Warning - code injection
 The code view allows the user to enter script contents. Make sure to filter/sanitize the HTML on the server. Otherwise, an attacker can inject arbitrary JavaScript code into clients.

 Contributing guide

See CONTRIBUTING.md for details on how to contribute to Summernote.

 Contributors ✨

Thanks go to these incredible people:


  


 Sponsors

Is your company using Summernote? Ask your boss to support us. Becoming a sponsor will help us dedicate more time to maintaining this project and to making it even better for all our users. Also, your company logo will show up on here and on our website :-) [Become a sponsor]


 Backers

If you would like to contribute financially as an individual, please consider becoming a Backer of Summernote.


 Contact

 Discord: Join the Summernote Discord community

Snapshot: 2026-11-04T14:00:00Z · Data license Apache-2.0 · JSON