1 | # [Quill Rich Text Editor](http://quilljs.com/) [![Build Status](https://travis-ci.org/quilljs/quill.svg?branch=master)](http://travis-ci.org/quilljs/quill)
|
2 |
|
3 | [![Test Status](https://cdn.quilljs.com/badge.svg?v=2)](https://saucelabs.com/u/quill)
|
4 |
|
5 | Quill is a modern rich text editor built for compatibility and extensibility. It was created by [Jason Chen](https://twitter.com/jhchen) and [Byron Milligan](https://twitter.com/byronmilligan) and open sourced by [Salesforce.com](http://www.salesforce.com).
|
6 |
|
7 | To get started, check out the [Quill website](http://quilljs.com/) for documentation, guides, and live demos!
|
8 |
|
9 |
|
10 | ## Useful Links
|
11 |
|
12 | - [Demo](https://quilljs.com/)
|
13 | - [Documentation](https://quilljs.com/docs/)
|
14 | - [How-to Guides](https://quilljs.com/guides/)
|
15 | - [Interactive Playground](https://quilljs.com/playground/)
|
16 | - [Contributing](https://github.com/quilljs/quill/blob/master/.github/CONTRIBUTING.md)
|
17 | - [Local Development](https://github.com/quilljs/quill/blob/master/.github/DEVELOPMENT.md)
|
18 |
|
19 |
|
20 | ## Quickstart
|
21 |
|
22 | Instantiate a new Quill object with a css selector for the div that should become the editor.
|
23 |
|
24 | ```html
|
25 | <!-- Include Quill stylesheet -->
|
26 | <link href="https://cdn.quilljs.com/1.0.0/quill.snow.css" rel="stylesheet">
|
27 |
|
28 | <!-- Create the toolbar container -->
|
29 | <div id="toolbar">
|
30 | <button class="ql-bold">Bold</button>
|
31 | <button class="ql-italic">Italic</button>
|
32 | </div>
|
33 |
|
34 | <!-- Create the editor container -->
|
35 | <div id="editor">
|
36 | <p>Hello World!</p>
|
37 | </div>
|
38 |
|
39 | <!-- Include the Quill library -->
|
40 | <script src="https://cdn.quilljs.com/1.0.0/quill.js"></script>
|
41 |
|
42 | <!-- Initialize Quill editor -->
|
43 | <script>
|
44 | var editor = new Quill('#editor', {
|
45 | modules: { toolbar: '#toolbar' },
|
46 | theme: 'snow'
|
47 | });
|
48 | </script>
|
49 | ```
|
50 |
|
51 | Take a look at the [Quill website](https://quilljs.com/) for more documentation, guides and [live playground](https://quilljs.com/playground/)!
|
52 |
|
53 |
|
54 | ## Download
|
55 |
|
56 | - [npm](https://www.npmjs.com/package/quill) - `npm install quill`
|
57 | - tar - https://github.com/quilljs/quill/releases
|
58 |
|
59 |
|
60 | ### CDN
|
61 |
|
62 | ```html
|
63 | <!-- Main Quill library -->
|
64 | <script src="//cdn.quilljs.com/1.0.0/quill.js" type="text/javascript"></script>
|
65 | <script src="//cdn.quilljs.com/1.0.0/quill.min.js" type="text/javascript"></script>
|
66 |
|
67 | <!-- Theme included stylesheets -->
|
68 | <link href="//cdn.quilljs.com/1.0.0/quill.snow.css" rel="stylesheet">
|
69 | <link href="//cdn.quilljs.com/1.0.0/quill.bubble.css" rel="stylesheet">
|
70 |
|
71 | <!-- Core build with no theme, formatting, non-essential modules -->
|
72 | <link href="//cdn.quilljs.com/1.0.0/quill.core.css" rel="stylesheet">
|
73 | <script src="//cdn.quilljs.com/1.0.0/quill.core.js" type="text/javascript"></script>
|
74 | ```
|
75 |
|
76 |
|
77 | ## Community
|
78 |
|
79 | Get help or stay up to date.
|
80 |
|
81 | - [Contribute](https://github.com/quilljs/quill/blob/develop/.github/CONTRIBUTING.md) on [Issues](https://github.com/quilljs/quill/issues)
|
82 | - Follow [@jhchen](https://twitter.com/jhchen) and [@quilljs](https://twitter.com/quilljs) on Twitter
|
83 | - Ask questions on [Stack Overflow](http://stackoverflow.com/questions/tagged/quill)
|
84 | - If privacy is required, email support@quilljs.com
|
85 |
|
86 |
|
87 | ## License
|
88 |
|
89 | BSD 3-clause
|
90 |
|
\ | No newline at end of file |