1
1
# Summernote
2
- Super Simple WYSIWYG Editor on Bootstrap(3.0 and 2.x).
2
+ Super simple WYSIWYG Editor using Bootstrap (3.0 and 2.x).
3
3
4
4
[ ![ Build Status] ( https://secure.travis-ci.org/HackerWins/summernote.png )] ( http://travis-ci.org/HackerWins/summernote )
5
5
6
6
### Summernote
7
- Summernote is a javascript program that helps you to create WYSIWYG Editor on web .
7
+ Summernote is a JavaScript library that helps you create WYSIWYG editors online .
8
8
9
9
Home Page: http://hackerwins.github.io/summernote/
10
10
11
11
### Why Summernote?
12
12
13
- Summernote has something specials no like others.
13
+ Summernote has a few special features:
14
+
15
+ * Paste images from clipboard
16
+ * Saves images directly in the content of the field using base64 encoding, so you don't need to implement image handling at all
14
17
* Simple UI
15
- * Interative WYSIWYG editing
18
+ * Interactive WYSIWYG editing
16
19
* Handy integration with server
17
20
18
21
#### Inspired by
19
- * Gmail WYSIWYG Editor (http://www.gmail.com )
22
+ * Gmail's WYSIWYG editor (http://www.gmail.com )
20
23
* Redactor (http://imperavi.com/redactor/ )
21
24
22
- ### Easy to install
25
+ ### Installation and dependencies
26
+
27
+ Summernote uses opensouce libraries: [ jQuery] ( http://jquery.com/ ) , [ Bootstrap] ( http://getbootstrap.com ) , [ Font Awesome] ( https://github.com/FortAwesome/Font-Awesome ) .
28
+
29
+ For [ Meteor] ( http://github.com/meteor/meteor ) , just run ` meteor add summernote:summernote ` . More info in the [ Meteor README] ( meteor/README.md ) .
23
30
24
- Summernote uses opensouce libraries(jQuery, bootstrap, fontAwesome)
31
+ For other/no frameworks:
25
32
26
- #### 01 . include js/css
33
+ #### 1 . include JS/CSS
27
34
28
- Include Following code into ` <head> ` tag of your HTML:
35
+ Include the following code in the ` <head> ` tag of your HTML:
29
36
30
37
``` html
31
38
<!-- include libraries(jQuery, bootstrap, fontawesome) -->
@@ -39,113 +46,51 @@ Include Following code into `<head>` tag of your HTML:
39
46
<script src =" summernote.min.js" ></script >
40
47
```
41
48
42
- If your summernote download is placed in a different folder, don't forget to change file's paths.
49
+ #### 2. target elements
50
+
51
+ Then place a ` div ` tag somewhere in the ` body ` tag. This element will be replaced with the summernote editor.
43
52
44
- #### 02. target elements
45
- And place ` div ` tag to somewhere in the ` body ` tag. This element will be placed by the visual representation of the summernote.
46
53
``` html
47
54
<div id =" summernote" >Hello Summernote</div >
48
55
```
49
56
50
- #### 03. summernote
51
- Finally, run script after document ready.
57
+ #### 3. summernote
58
+
59
+ Finally, run this script after the DOM is ready:
60
+
52
61
``` javascript
53
62
$ (document ).ready (function () {
54
63
$ (' #summernote' ).summernote ();
55
64
});
56
65
```
57
66
58
67
### API
59
- Get HTML ` code ` if you need.
68
+
69
+ ` code ` - get the HTML source code underlying the text in the editor:
60
70
61
71
``` javascript
62
72
var sHTML = $ (' #summernote' ).code ();
63
73
```
64
74
65
- ` Destroy ` summernote.
75
+ ` Destroy ` summernote:
66
76
67
77
``` javascript
68
78
$ (' #summernote' ).destroy ();
69
79
```
70
80
71
- #### Dependencies
72
- * jQuery: http://jquery.com/
73
- * Bootstrap: http://getbootstrap.com (both 2.x and 3.x)
74
- * fontAwesome: https://github.com/FortAwesome/Font-Awesome (both 3.x and 4.x)
81
+ ### Supported platforms
75
82
76
- ### Supported platform
77
- * Modern Browser (Safari, Chrome, Firefox, Opera, Internet Explorer 9+)
78
- * OS (Windows, Mac, Linux)
83
+ Any modern browser: Safari, Chrome, Firefox, Opera, Internet Explorer 9+.
79
84
80
85
### Upcoming Features
81
- * Responsive Toolbar
82
- * Table: Handles(Sizing, Selection) and Popover
83
- * support IE8
84
- * Clipboard
85
- * Media Object Selection
86
-
87
- ### Change Log
88
-
89
- #### v0.5.9 2014-09-21
90
- * Dom Editing: insert(Un)OrderedList, indent/outdent
91
- * History in a line.
92
-
93
- #### v0.5.8 2014-08-31
94
- * Remove ` autoFormatRange ` option
95
- * Fixed ` onChange ` issues
96
-
97
- #### v0.5.7 ~ v0.5.4 2014-08-29 ~ 2014-08-23
98
- * Dom editing: insertPara, insertNode
99
-
100
- #### v0.5.3 2014-07-25
101
- * Extract codemirror.autoFormatOnStart option
102
- * Bug patch (createLink)
103
-
104
- #### v0.5.2 2014-07-20
105
- * Air Mode
106
- * And bug patch (scroll, createLink, ...)
107
-
108
- #### v0.5.1 2014-03-16
109
- * Support 15 Languages(https://github.com/HackerWins/summernote/tree/master/lang )
110
- * Add local-server for develop summernote.
111
- * Font style: Font-Family
112
- * And Bug patch.
113
-
114
- #### v0.5 2013-12-29
115
- * Support both Font-Awesome 3.x and 4.x
116
- * CodeMirror as Codeview
117
- * Insert Video (by cdownie)
118
- * Support 5 Languages(by hendrismit, tschiela, inomies, cverond)
119
- * Restructuring: jQuery build pattern
120
-
121
- #### v0.4 2013-11-01
122
- * Support both Bootstrap 3.0 and 2.x
123
- * Fullscreen
124
- * Codeview
125
- * Image Upload callback
126
-
127
- #### v0.3 2013-09-01
128
- * Bugs(image upload, fontsize, tab, recent color, ...)
129
- * Help dialog(keyboard shortcut)
130
- * Init options(event callbacks, custom toolbar)
131
- * Resize bar
132
- * Support IE8 Beta(some range bugs, can't insert Image)
133
-
134
- #### v0.2, 2013-08-01
135
- * Undo/Redo
136
- * Image sizing handle and popover
137
- * Support standalone css
138
- * Support Multiple Editor
139
- * Remove jQuery.curstyles dependency
140
-
141
- #### v0.1, 2013-07-01
142
- * Font style: size, color, bold, italic, underline, remove font style
143
- * Para style: bullet, align, outdent, indent, line height
144
- * Image: drag & drop, dialog
145
- * Link: popover and dialog
146
- * Table: create table with dimension picker
147
-
148
- ### for Hacker
86
+ * Responsive toolbar
87
+ * Table: Handles (sizing, selection) and popover
88
+ * IE8 Support
89
+ * Clipboard (you can paste images already)
90
+ * Media object selection
91
+
92
+
93
+ ### Developer information
149
94
150
95
#### structure of summernote.js
151
96
0 commit comments