Quill installation on Meteor JS

Fistly put these link on top of your page.

<link href="//cdn.quilljs.com/1.2.3/quill.core.css" rel="stylesheet">
<script src="//cdn.quilljs.com/1.2.3/quill.core.js"></script>

<script src="//cdn.quilljs.com/1.2.3/quill.js"></script>
<script src="//cdn.quilljs.com/1.2.3/quill.min.js"></script>

<link href="//cdn.quilljs.com/1.2.3/quill.snow.css" rel="stylesheet">
<link href="//cdn.quilljs.com/1.2.3/quill.bubble.css" rel="stylesheet">

Now we need to add this div to show editor's toolbar for performing in editor operations on front page.

Attached screenshot contains the fiddle screen shot in what i have already integrated the quill editor for future references.

<div id="editor">
  <p>dummy text</p>
</div>

Now we need to add this script in order to bind id editor with editor.
for this add script at bottom of page.

<script>
     var toolbarOptions = [
                           ['bold', 'italic', 'underline', 'strike'],        
                           ['blockquote', 'code-block'],

                           [{ 'header': 1 }, { 'header': 2 }],               
                           [{ 'list': 'ordered'}, { 'list': 'bullet' }],
                           [{ 'script': 'sub'}, { 'script': 'super' }],      
                           [{ 'indent': '-1'}, { 'indent': '+1' }],          
                           [{ 'direction': 'rtl' }],                         

                           [{ 'size': ['small', false, 'large', 'huge'] }], 
                           [{ 'header': [1, 2, 3, 4, 5, 6, false] }],

                           [{ 'color': [] }, { 'background': [] }],          
                           [{ 'font': [] }],
                           [{ 'align': [] }],
                           ['link', 'image'], 
                           ['clean']                                         
                         ];

     var editor = new Quill('#editor' , {
       modules: {
         toolbar: toolbarOptions
       },
       theme: 'snow'
     });
 </script>

Thats all what it takes to setup quill.

Comments

Popular posts from this blog

Setting up Orthanc server on Ubuntu 16

How to install COMODO SSL Certificates for NGINX

HTML