Days
Hours
Minutes
Seconds
x

New Froala Editor v5.0.0 is here โ€“ Learn More

Skip to content
Froala Documentation

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

Ready to dive in? Explore our plans

Sign up

Download the code by signing up for our newsletter

Sign up

Download the code by signing up for our newsletter

Note: By registering, you confirm that you agree to the processing of your personal data by Froala, Inc. - Froala as described in the Privacy Statement. Froala, Inc. - Froala is part of the Idera group and may share your information with its parent company Idera, Inc., and its affiliates. For further details on how your data is used, stored, and shared, please review our Privacy Statement.