Quill

The best way to get started is try a simple example. Quill is initialized with a DOM element to contain the editor. The contents of that element will become the initial contents of Quill.

Documentation for Quill
Getting Started

Add Quill as an NPM dependency and add it your own build workflow, or use the included built options. Compiled stylesheets are also included in dist/ folder.

              npm install [email protected]
            

Example

                      
                        <div class="counter purecounter" data-purecounter-delay="50" data-purecounter-start="0" data-purecounter-end="36487">0</div>
                        <div class="counter purecounter" data-purecounter-delay="50" data-purecounter-start="0" data-purecounter-end="10">0</div>
                        <div class="counter purecounter" data-purecounter-delay="50" data-purecounter-start="0" data-purecounter-end="856">0</div>
                        <div class="counter purecounter" data-purecounter-delay="50" data-purecounter-start="0" data-purecounter-end="4562">0</div>
                        <div class="counter purecounter" data-purecounter-delay="50" data-purecounter-start="0" data-purecounter-end="5321">0</div>
                        <div class="counter purecounter" data-purecounter-delay="50" data-purecounter-start="0" data-purecounter-end="12356">0</div>
                      
                    
How to use?

Copy-paste the following <script> near the end of your pages under Muze Javascript Plugins to enable it.

              
                <script src="../assets/vendor/quill/dist/quill.min.js"></script>
              
            

Copy-paste the following <link> near the end of your pages under Muze Plugins CSS to enable it.

              
                <link href="../assets/vendor/quill/dist/quill.snow.css" rel="stylesheet" type="text/css" media="all">
              
            

Copy-paste the init function under JS Plugins Init before the closing </body> tag, to enable it.

              
                var toolbarOptions = [
                ['bold', 'italic', 'link', { 'list': 'ordered'}, { 'list': 'bullet' }, 'image', 'blockquote'],
                ];
                  var quill = new Quill('#editor', {
                    theme: 'snow',
                    placeholder: 'Start typing...',
                    modules: {
                      toolbar: toolbarOptions
                    },
                  });