49min

ZQ RTE Plugin 2.0

Introduction

Completely rewritten from the ground up, the RTE plugin just got smarter with the new version 2.0. Lighter and more efficient code made the plugin element simple to use and feature-rich.

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

This plugin supports lightweight mode, mentions, hashtags, pasting images from the clipboard and other useful features that make this plugin a really powerful WYSIWYG Editor.

How to setup

  1. Install plugin via Plugin Tab
Document image

2. Place ZQ RTE element on page and set the proprieties accordingly.

Document image

3. You're all set to go!

Plugin Element Proprieties

The plugin comes with 2 elements which can used on page to get access to actions, events and states.

ZQ RTE - is a clean, toolbar theme.

Document image

ZQ RTE lite - simple tooltip based theme.

Document image

Plugin Proprieties

Document image

Both elements ZQ RTE and ZQ RTE Lite have same set of proprieties.

  • Content - set initial content for RTE (can be either Static or Dynamic Data) ; Should be Text Type
  • Placeholder - set a placeholder text for RTE (can be either Static or Dynamic Data) ; Should be Text Type
  • Maximum Characters - set a limit for characters ; Should be a Number Type
  • Read Only - set the mode to make the RTE in Read Only
  • Mentions - set the datatype from Database for mentions ; Should be Text Type
  • Mentions Captions - set the Column name from the datatype for mentions
  • Mentions List - search through list of mentions from Database
  • Hashtags - set the datatype from Database for hashtags ; Should be Text Type
  • Hashtags Captions - set the Column name from the datatype for hashtags
  • Hashtags List - search through list of hashtags from Database

Please check that you set the correct type for mentions, hashtags and columns which will be used for displaying these respective values.

Plugin Actions

  • Enable User Input a ZQ Lite RTE - Enables Lite RTE element's input form
  • Disable User Input a ZQ Lite RTE - Disables Lite RTE element's input form
  • Focus RTE a ZQ Lite RTE - Focuses on Lite RTE element's input form
  • Blur RTE a ZQ Lite RTE - Removes focus from Lite RTE element's input form
  • Set Text a ZQ Lite RTE - Sets text value into Lite RTE element's input form
  • Update Content a ZQ Lite RTE - Updates the content of Lite RTE element's input form by setting the index , text and delete options for the action.
  • Delete Text a ZQ Lite RTE - Deletes text of Lite RTE element's input form by setting index and length in number type.
  • Reset a ZQ RTE - Resets the content of RTE element
  • Reset a ZQ Lite RTE - Resets the content of Lite RTE element

Plugin Events

  • A ZQ Lite RTE Selection Changed
  • A ZQ Lite RTE Text Changed
  • A ZQ Lite RTE Typing
  • A ZQ Lite RTE Stop Typing
  • A ZQ Lite RTE Limit Reached
  • A ZQ Lite RTE Focused
  • A ZQ Lite RTE Blur'ed
  • A ZQ Lite RTE Mention Clicked
  • A ZQ Lite RTE Hashtag Clicked

Plugin States

Document image
  • RTE Enabled
  • Last Selection
  • Text
  • Content Length
  • HTML
  • User Typing
  • Last Clicked Mention ID
  • Last Clicked Hashtag ID
  • Used Mentions ID's
  • Used Hashtags ID's

Changelogs

Update: 28/12/2020 -

  • Fixed problem with the cursor

Update: 08/02/2021 -

  • Fixed minor bug

Update: 26/02/2021 -

  • Fixed the problem with states Mention and Hashtag

Update: 26/02/2021-

  • Minor fixes

Update: 12/03/2021 -

  • fixed problem with an empty value

Update: 29/03/2021 -

  • fixed problem with the 's HTML state.

Update: 31/03/2021 -

  • fixed problem with the 's HTML state (initial content).

Update: 05/04/2021 -

  • Fixed problem with states.

Update: 02/06/2021 - Version 1.83.0

  • eliminated conflict between ZQ RTE and Bubbles RTE

Update: 10/06/2021 - Version 1.84.0

  • eliminated emoji button from top-right ZQLiteRTE

Update: 4/08/21 - Version: 1.89.0

  • fixed problem with resizable and dynamic content

Update: 26/08/21 - Version 1.90.0

  • Fixed reset action, height counting in popup, max limit chars, and removed extra line break

Update: 15/09/21 - Version 1.91.0

  • removed extra linebreak

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 07.02.22 - Version 1.96.0

  • fixed problem with pop-up height.

Update 02.03.22 - Version 1.98.0

  • has been added the possibility to resize images dynamically

Update 17.05.22 - Verison 1.102.0

  • fixed problem with resizing images

Update 21.06.22 - Version 1.103.0

  • fixed the limit of the max number of characters.

Update 21.06.22 - Verison 1.104.0

  • emoji display fix

Demo to preview the settings