Skip to main content
All CollectionsGovernance and security
The Rich text feature in your application
The Rich text feature in your application

This article highlights the rich text feature and how to use it optimally

Updated over 6 months ago

In this article, we cover the use of rich text in your application, and what to look out for.

What is rich text

Rich text is a kind of text formatting that allows you to create and display formatted text and/or basic code in your application.

Showing a rich text input and rich text inside an application

In this example, we see the Rich text input component and a text component that can display rich text.

The rich text input component allows you to style your text with formatting options such as bold, italic or underlined.

As shown in the example, the HTML tag <b> opens the Bold statement, and the tag </b> closes the bold statement, displaying all text in between in Bold.

For more advanced use cases, this also means that you can request users to insert pieces of code via the rich text input field, or display code via the rich text display.

Where in your application can it be used

Text can be displayed as rich text (html) on a page. A developer can make this happen when using either:

  • Text component > Display rich text option

  • Rich text editor input > Value option

In most cases, we see applications that require users to write bigger pieces of text, such as a blog, implementing a rich text input as it allows your application users to format their text.

Using the HTML feature of rich text and its security

Collecting script code and displaying it can be handy for applications that need to show solutions in code, do sanitization checks, or have other uses for scripts.

However, we also need to point out that badly written code can sometimes do more harm than good, therefore we would like to point out how you can prevent code to be collected or displayed.

To prevent your pages from displaying rich text code, you can turn off the Display Rich Text option in your Text component.

The rich text option on a text component

To prevent your application from collecting rich text HTML input, you can either use a regular text input field in your form or scan and sanitize the input data in your action before saving it in your application.

You can do this by comparing text from the code in a condition step, or by using the expression step to replace tags such as the <script> tag with a keyword before saving it in your application. This will allow you to check and make any sanatization changes before using the code in your application.

An action using a custom action step that replaces the script tag from a rich text input.

Note: this is but an example, test any feature you build carefully, making sure your features are build as intended.

Did this answer your question?