Summernote is a simple, flexible, WYSIWYG editor built on jQuery and Bootstrap. If you are interested in the bootstrap text editor, learn about it. Summernote is a simple and flexible WYSIWYG editor built on jQuery and Bootstrap. All major operations of Summernote support shortcut keys. There is a powerful API that provides a large number of custom options for design (width, height, and effective projects) and functions. This project provides integration examples for major scripting languages or frameworks (PHP, Ruby, Django, and NodeJS.
Bootstrap summernote is introduced on its official website as "Super Simple WYSIWYG editor". However, in my opinion, it should be simpler than the "bootstrap-wysiwyg" provided on the Chinese official website of bootstrap, more beautiful and easier to use!
Although I have tried bootstrap-wysiwyg before, I can refer to how Bootstrap wysiwyg Rich Text data is saved to mysql, but Zhuge Liang's experience tells me that summernote is definitely a better Rich Text Editor, click for the team !!!!!
After a day of exploration, I have some knowledge about summernote, so to facilitate the majority of front-end enthusiasts, I will try my best to introduce summernote, a super benefit.
1. Download the official API and source code
To do a good job, you must first sharpen the tool. First, get the source code of summernote and the corresponding official API to tell everyone that it is the first task!
Official website (demo and api)
Download github source code. Pay attention to download the development version.
II,
1
2
3
Iii. Opening lecture content
The general direction is as follows:
Page Layout of summernote (resource introduction and initial parameters)
How to upload images from a local device using summernote (front-end onImageUpload method and backend springMVC file storage)
Data submission of form in which summernote is located
①. Page Layout of summernote
<% @ Include file = "/components/common/taglib. jsp" %>
Summernote-bs3fa4