Skip to main content
Rich Text

Elevate collaboration with Yeeflow's rich-text fields. Enhance communication and presentation of information seamlessly.

Updated over 6 months ago

A Rich Text field control is great for article editing, news and notification publishing and other rich style text, images contents. In Yeeflow, we integrated with TinyMCE, which is one of the world's most advanced rich text editors. It's used 'under the hood' on thousands of different kinds of platforms.


Add Rich Text to the form

Firstly, find the Rich Text control in the controls add panel. Then, drag and drop it into a section or container on your form.


Basic of the Rich Text field

Open the Content > Basic block, and set the Title's text of this Rich Text control. For more information about Title for field control, please refer:

Set the Associated variable for this Rich Text control. When you add a new Rich Text control, a default variable will be generated automatically. You can click the Edit Button to change the ID and name, or click the Reset button to bind this Rich Text control to other existing variables. For more information, please refer:


Appearance of the Rich Text field

Open the Content > Appearance block to set the appearance and layout of this Rich Text control.

Type: Set the available operations on the toolbar of this Rich Text field control:

  1. All: Show all functions including on the Rich Text filed to give users the fully control about the formatting of contents.

  2. No toolbar: Hide toolbar to only show the text area.

  3. Simple toolbar: Only show some of the most common features on the toolbar.

  4. Customize: Customize the features which will be available on the toolbar by clicking the settings button from the "Choose Toolbar" option next to the Type.

Display Title: Choose display or hide the label of this control. For more information, please refer: Understand the title of field controls

Allow comment: Turn on this option will allow users to add comments on this control.


Validation of the Rich Text field

Open the Content > Validation block to set the properties of this Rich Text control.

Readonly: Turn this ON will make this field control as view only status.

Required: Make it mandatory for your users to type in content in this field.

Max Length: Control how many characters the users are allowed to type the text.

Default value: Set a default content of this Rich Text field.

Custom Validation: Set the custom validation rules. An error message that will display under your field when specified conditions become true. It will allow you to add any number of rules for validating your field. Learn more about the Custom Validation.


Action call of the Rich Text field

Open the Content > Action

block to call a pre-defined action from the dropdown list. This action will be triggered once the value of this image field is changed.


Style the Rich Text

Field - Editable

Open the Style > Field - Editable block to set the styles of the field control for it's editable status.

  1. Font Family: Select font from the font family dropdown list.

  2. Background Color: Set background color of the field. By default, the background color is set as transparent.

  3. Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved.

  4. Radius: Set the border radius to control corner roundness.

  5. Shadow: Adjust box shadow options

  6. Field Width: Set the width of the field control in PX , %, em, rem, vw, calc.

  7. Field Alignment: Set the alignment of the field control. This will only be effected when the field width is less than the outside container.

  8. Error Message: Set the styles of the error message,

    • Typography: Set the typography options for the error message.

    • Color: Choose the color of the error message's text.


Field - Read Only

Open the Style > Field - Read Only block to set the styles of the field control for it's view only status.

  1. Background Color: Set background color of the field. By default, the background color is set as transparent.

  2. Padding: Set the Padding of the field control.

  3. Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or grooved.

  4. Radius: Set the border radius to control corner roundness.

Style of title

Set the Title of field controls that are applicable to this control.


Advanced Settings

Set the Advanced options that are applicable to this control.

Did this answer your question?