You can add a block of text to your form using a rich-text component. Use rich-text components to add non-editable text to a form to display to your app users. Rich-text components are customizable and there are many ways you can utilize the component for your end users needs.
For example, add detailed instructions for completing the form like scheduling guidelines for assistants. Use a rich-text component to inform new patients about the documentation they’ll need to complete their new patient paperwork or add recall information on a construction material inventory form.
Add a rich-text component to your form
To add a rich-text component to your form:
- Select Click to add here in your desired column or hover between two existing rows of elements on the form builder canvas
- Select the rich text component from the form element menu to add it to your form.
When you add your rich-text component it will be in edit mode and ready for you to start adding your text. The rich-text component settings menu will always stay open when you're editing your rich-text component.
Customize a rich-text component
You can customize your rich-text component in the rich-text component settings menu.
- Choose one or more options to display your rich-text component when users edit, view, and add records.
- Add background color to your rich-text component by turning on Background color.
- Set a label to display on the form.
- Select a color from the palette or add a hex code to the field provided.
- Select auto width to adjust the width of your rich-text component automatically based on the width of the column or set a fixed width.
Edit your rich-text component
Select edit inside the rich-text component to start editing your text.
Rich-text component editing options
- Text styles. You can choose different text styles to change the size and weight of your text. Choose from Paragraph, Heading 1, Heading 2, or Heading 3.
- Emphasis. Add emphasis to your text using bold, italics, or underline options.
- Strikethrough. Strikethrough adds a line through the text you select.
- Text alignment. Align your text to the left, right, center, or justified using the text alignment dropdown.
- Code. Format your selected text as a code block using the code option.
- Subscript and superscript. Format your selected text as subscript to display smaller text beneath the text line or as superscript to display smaller text above the text line.
- Link. Add a URL link to text in your rich-text component using the link option. Select the text you’d like to add a link to and use the code icon to open the link URL field. Add your desired link and select the checkmark to confirm.
- Bulleted and numbered lists. Add a bulleted or numbered list to your rich-text component by using the bulleted and numbered list options.
-
Horizontal line. Separate text into sections in your rich-text component with horizontal lines. The horizontal line option adds a thin black line at your cursor. Add as many horizontal lines as you like to your rich- text component.
- Block quote. Format your selected text as a block quote using the block quote option. Block quote shifts the selected text to the right and adds a vertical accent to highlight the selection.
- Insert table. Insert a table in your rich-text component up to 10 columns by 10 rows wide. When you add a table to your rich-text component, you’ll see a new table menu that will allow you to configure table columns, rows, and cells, and make changes to table properties.
- Font color. Add color to your text using the Font color option. You can choose a color from the color palette or use the Remove color tool to return text to the default black color.
- Font background color. Add a background color to highlight your selected text. You can choose a color from the color palette or use the Remove color tool to return the text background color to default clear.
Note: Font background color is different from the rich-text component form element background color. The font background color will be layered over the rich-text form element background color.
Confirm your rich-text component changes
When you’re ready to confirm the changes you’ve made to your rich-text component, select Done to close the rich-text component editor. You can open the editor again by selecting Edit. You will need to save your form to save your rich-text component and the changes you have made in the rich-text component editor.