Froala Documentation
- Installation Guides
- Browser Support
- Languages Support
- Shortcuts
- Activation
- Examples
- Customize the Editor
- Use-cases
- Plugins
- APIs
- Development Frameworks
- Server Integrations
- Server SDKs
- Migration Guides
- Changelog
- Tutorials
- Froala Docs
- /
- Plugins
- /
- Quick Insert Plugin
Quick Insert Plugin
Plugins are fully functional during your trial once you've added your trial key to the setup.
Helper to add images, tables and other stuff easier and faster, It appears when you have the cursor on a blank new line.
Plugin options:
| quickInsertButtons Array - |
The buttons to display in quick insert.
Default: ['image', 'video', 'embedly', 'table', 'ul', 'ol', 'hr'] |
| quickInsertEnabled Boolean - |
To enable quick insert functionality.
Default: true |
| quickInsertTags Array - |
The list of tags for which the quick insert button will appear when empty.
Default: ['p', 'div', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'blockquote'] |
Plugin events:
| quickInsert.commands.after (cmd)) |
This event is a generic event that is triggered after every command inside the Quick Insert tool is executed.
โ cmd The command name. |
| quickInsert.commands.before (cmd)) |
This event is a generic event that is triggered before every command inside the Quick Insert tool is executed. Note: Returning false in the handler assigned to the event will cancel the current action. โ cmd The command name. |
Add Plugin to your code:
Plugin name: quickInsert
Plugin JS Script: ../js/plugins/quick_insert.min.js
Or from CDN https://cdn.jsdelivr.net/npm/froala-editor@latest/js/plugins/quick_insert.min.js
Plugin CSS link: ../css/plugins/quick_insert.min.css
Plugin CSS link https://cdn.jsdelivr.net/npm/froala-editor@latest/css/plugins/quick_insert.min.css
Example :
โ Quick Insert Menuโ Custom Quick Insert Button
