Rich Text component
Add a rich text field to a page to accept rich text user input.
Overview
Add a rich text component to a page to show a TinyMCE content editor, and capture rich text input from your users. For example, if you want your users to provide formatted text content in response to a question or statement.
- Rich text data is stored in values of the 'content' content kind. See Value content kinds.
General settings
Configure the general settings for the component.
| Setting | Description |
|---|---|
| Name | Enter a name for the component. |
| Label | Enter a label for the component. The label is displayed above the component by default. Do not enter a label if you do not require this text to be shown. |
| Editable | 1. Specify if the component can accept user input.- Select the checkbox to allow the component to accept input from a user. 2. De-select the checkbox to prevent a user from being able to input or interact with the component. |
| Placeholder text | Enter a short hint to display in the field, such as an example of the expected value or format. |
| Help information about this component | Display help text directly below the component, for example to provide further information on how to use the component. |
State
Select the value that you wish to save the user input data into.
- Save the component state into: Click Select or create a new value to select an existing value or create a new value.
Values must be of the 'content' content kind. See Value content kinds.
Validation
Add client-side page validation to the component. You cannot add validation if you are saving state data into a boolean or object value.
- Click Add Validation.
- Select the validation Type.
- Enter a valid Value for the validation type.
- Enter a feedback Message to show to the user if the validation criteria is not met.
- Click Update to add the validation item.
| Setting | Description |
|---|---|
| Help information about this component | Display help text directly below the component, for example to provide further information on how to use the component. |
| Label | Enter a label for the text component. The label is displayed above the component by default. Do not enter a label if you do not require this text to be shown. |
| Name | Enter a name for the component. |
| Placeholder text | Enter a short hint to display in the field, such as an example of the expected value or format. |
| Editable | 1. Select the checkbox to allow the component to accept input from a user. 2. De-select the checkbox to prevent a user from being able to input or interact with the component. |
Styles
Apply additional CSS styling to the component.
- Enter space-delimited CSS classes/selectors into the CSS Classes field.
When you run the flow, these classes are appended to the main component class.