quill

In this demo there's a dropdown with the options "Heading 1", "Heading 2" and "Normal". I'm looking for a way to customize that with my own options (or adding a new button instead of dropdowns) using div classes. For example, I want to add a new option called "myThing" and it turns this: <p>Lorem ipsum dolor sit amet</p> into this: <div class="myThing">Lorem ipsum dolor sit amet</div> How do I do that? You can do this by extending the block blot. As shown in the this section of the Quilljs guides. Just extend the block blot, and set your tag and class name. Example: var Block = Quill.import(

I am using quilljs for my editor. All my data are handle by mysql database. I am using Angularjs 1.x and for backend Cakephp is my frame-work. I am currently trying to build a forum kind of page in which I want to save multiple images along with text which will be formatted using quilljs <p>sd<img src="data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgA....SUVORK5CYII=" alt="i am image"><b>it is image of earth</b></p> This is what currently storing in my database. Now if there is multiple big images come in then size of field will be too much high there for I want to upload image inside severside

I am working on quill rich editor, i need all headings (h1....h6). I have tried different ways but it just shows (h1 and h2) and sometimes it show 3 headings. Html code: <div id="standalone-container"> <div id="toolbar-container"> <span class="ql-formats"> <select class="ql-font"></select> <select class="ql-header"></select> </span> <span class="ql-formats"> <button class="ql-bold"></button> <button class="ql-italic"></button> <button class="ql-underline"></button> <button class="ql-strike"></button> </span> <span class="ql-formats"> <select class="ql-color"></select> <select class="ql

I know that on instantiation of a Quill editor, there is a placeholder option. Is there a way that I can change this placeholder dynamically after the editor is instantiated? The placeholder is implemented with a CSS rule: .ql-editor::before { content: attr(data-placeholder); } So you can do quill.root.dataset.placeholder = 'Your new placeholder'; Shubham Prakash If you are using react-quill The placeholder in the tooltip is coming from the value of the data-link attribute. So you can replace the value with your own when the component finishes mounting. Here is the code: componentDidMount() {

I have a a template which displays rich text data. When the user clicks edit I turn the template into an editable Quill editor like so: 'click #editNote': (e, t) -> note = t.find '.container' console.log note basicEditor = new Quill(note) Then once the user clicks save I want to be able to disable the Quill editor. How can I do this? This isn't currently documented but you can do this: basicEditor.editor.enable(false) Use this statement var quill = new Quill('#editor-container'); quill.enable(false); Shivanshu Goyal quill.disable() should do the trick. 来源： https://stackoverflow.com/questions

I'm hitting some problems extending Quill. I want to modify the List and ListItem classes in Quill, so I tried to copy formats/list.js into my code base as a starting point. I then import my local copy and register it with Quill like so... import { List, ListItem } from './quill/list'; Quill.register({ 'formats/list': List, 'formats/list/item': ListItem }, true); However, when I attempt to create a list in the editor the code crashes in the List class with the following error: ParchmentError {message: "[Parchment] Unable to create list-item blot", name: "ParchmentError"} This happens on this