Harness and Section forms - Adding a Rich Text Editor control

You can add a Rich Text Editor control to a cell, enabling users to add and edit rich text within web browsers. A Rich Text Editor control presents the user with WYSIWYG editing area. This makes it easy for users to use familiar document formatting: changing the font type, weight, format, color, and create bulleted or numbered lists.

You can configure the Rich Text Editor toolbar, enabling users to insert additional elements, such as tables, images, and indentation. At run time, users can drag and drop text and images into or out of the control while preserving formatting.

The rich text editor control is responsive when added to a dynamic layout. You can configure events on the control, such as displaying a Smart Tip on hover or refreshing the section on change.

Style the rich text editor control as desired in the skin. For more information, see Skin form — Components tab — Controls — Rich Text Editor.

The UI Gallery landing page contains a working example of this element. To display the gallery, in Dev Studio, click Configure > User Interface > Gallery > UI elements.

  1. In the harness, section, or flow action, select the Rich Text Editor control from the Advanced controls group.
  2. Drag the control into the layout and release the mouse button to drop the control.
    If you are using a cell-based layout and you drag the control into a cell that is not empty, then the dropped control replaces the current contents of the cell.
  3. Click the Gear icon to display the Cell Properties panel and use the following tabs to define the radio button: