@itech-indrustries/quote
v2.3.0
Published
Quote Tool for Editor.js
Downloads
2
Maintainers
Readme
Quote Tool
Provides Quote Blocks for the Editor.js.
Installation
Install via NPM
Get the package
npm i @itech-indrustries/quote
Include module at your application
const Quote = require('@itech-indrustries/quote');
Download to your project's source dir
- Upload folder
dist
from repository - Add
dist/bundle.js
file to your page.
Load from CDN
You can load specific version of package from jsDelivr CDN.
https://cdn.jsdelivr.net/npm/@itech-indrustries/quote@latest
Then require this script on page with Editor.js.
<script src="https://cdn.jsdelivr.net/npm/@itech-indrustries/quote@latest"></script>
Usage
Add a new Tool to the tools
property of the Editor.js initial config.
var editor = EditorJS({
...
tools: {
...
quote: Quote,
},
...
});
Or init Quote Tool with additional settings
var editor = EditorJS({
...
tools: {
...
quote: {
class: Quote,
inlineToolbar: true,
shortcut: 'CMD+SHIFT+O',
config: {
quotePlaceholder: 'Enter a quote',
captionPlaceholder: 'Quote\'s author',
},
},
},
...
});
Config Params
| Field | Type | Description |
| ------------------ | -------- | ----------------------------|
| quotePlaceholder | string
| quote's placeholder string |
| captionPlaceholder | string
| caption's placeholder string|
Tool's settings
You can choose alignment for the quote. It takes no effect while editing, but saved the «alignment» param.
Output data
| Field | Type | Description |
| --------- | -------- | -------------------- |
| text | string
| quote's text |
| caption | string
| caption or an author |
| alignment | string
| left
or center
|
{
"type" : "quote",
"data" : {
"text" : "The unexamined life is not worth living.",
"caption" : "Socrates",
"alignment" : "left"
}
}