ZQ Rich Text Editor Plugin


Rich Text Editor the wysiwyg editor which comes with toolbar equipped from bold, italic, underline options to attaching a link or uploading a file (image). Change the heading size or choose from more fonts.

Note: This plugin is no longer maintained , see ZQ RTE 2.0 - https://docs.zeroqode.com/plugins/zq-rte-plugin-2.0

Getting Started

You can apply the following settings:


There are three mode types available "Default", "Lite" and "Display Only"

To use “Lite” mode, select some text and an tooltip will appear with RTE toolbar.

Initial content source

The source can be loaded from Bubble database or local (PC) storage.

Initial Content

Based on your previous selection, you can load data to fist display


Place holder will be used in case, no content entered

Stretch to fit content (For Displaying data) [yes/no]

If selected, the height of the RTE container will be automatically calculated.

Read only [yes/no]

If selected, there won't be any way to write new content

Enable shortcuts [yes/no]

Instead clicking on icons, you can allow to write shortcuts to mark text as follow:

# Headers **Bold text** *Italic* ***Bold italic*** ~~Strikethrough~~ - Bullet points 1. Numbered lists [] Checkboxes []() Links

Allow input characters limitation [yes/no]

Set a limited number of characters for your editor

Character limit

Set a limited number of characters for your editor

Enable hashtags [yes/no]

You can allow hashtags in your editor


List of available hashtags separated by comma.


Enable mentions [yes/no]

You can allow direct marking of people and after saving, you will have all of them available in workflow, for future work

Mentions source

Select database to search for mentions, and identifier, that will be used to locate the proper user.* Make sure you apply list of unique IDs of your table

Data type

Database where will be searched the mentions (Usually user table, but can be whatever else that fwhere are stored your mentions)* Make sure you used proper database name, otherwise the editor will remain empty.

Column Name

Column from which will be loaded data for mentions


Local storage field name

You can save temporal data in local storage, so you can abandon them and use once again when you open browser. You just need to specify under which name it will be saved.

Enable autosaving draft to Local storage [yes/no]

Enables autosave while writting

Autosaving Interval (s)

States how often will be content saved


Default font

You can specify what font type will be used by default

Default font size (px)

You can specify what font size will be used by default *

You can enable or disable next buttons:

H1,H2,H3,H4,H5,H6, bold text, italic text, underline text, strike text, blockquote,code-block, ordered list, bullet list, superscript, subscript, outdent, indent, text direction, text colour, text background colour, font alignment, video viewer, image, maths formulas, text styling removal, links, font size, fonts


You can paste an image directly from buffer, from example if you made an Print Screen on your PC, you can instantly paste that in editor. Or you can just copy an image from your PC, and again, paste it in editor, it will be automatically added.

Images size and resolution can be controlled as well.

Images max width

This parameter controls how an image is shown in your editor, if you want it to be displayed with full width of the container then just insert 100%

Document image

Or you can insert fixed width, for example 500px then all inserted images will be displayed with max width of 500px. Write it without “px” only numbers. This will not change image resolution. Resize images

If this is enabled, you can set a custom width to resize, so if a user upload an image with width bigger than 1920px then it will be resized to given width and only then upload to server.

Document image


Video Width

For full width write 100%, for custom width insert just a number, for example, 720

Video Height

Height in pixels


Border radius

This will change border radius for default mode.

Tooltip border radius

This will change border radius for tooltips and for Lite mode.

Buttons hover color

This is for buttons from toolbar.


RTE content is changed

Fires whenever the content of Rich text editor changesYou can set custom time when this will be triggered, by default is 1 second.

Document image

RTE the limit is reached

Fires whenever the content reached the allowed number of characters

RTE mention is clicked (for displaying data mode)

Fires whenever mention in display mode is clicked

RTE hashtag is clicked (for displaying data mode)

Fires whenever hashtag in display mode is clicked Make Live Changes


Update 05/02/21:

  • Fixed minor bug

Update 26/02/21:

  • Added Emoji and added an option for toggling individual items off.

Update 01/07/21 (Version: 1.85.0):

  • Added feature 'RTE resizable'.

Update 03/07/21 (Version: 1.86.0):

  • Added feature 'RTE resizable'.

Update 4.08.21 Version: 1.89.0

  • fixed problem with resizable and dynamic content.

Update 03.11.21 - Version 1.92.0

  • improved editor with emoji's short name

Update 13.11.21 - Version 1.93.0

  • fixed the problem with updating content

Update 11.01.22 - Version 1.95.0

  • А new option for image was added
Document image

Demo to preview the settings

Updated 21 Jun 2022
Did this page help?