Rich Text Editor Component

Overview

Starting in 24.2, the Styled Text Editor Component is available directly in the product. Consider using this in place of the plug-in moving forward. For more information, review: https://docs.appian.com/suite/help/latest/Styled_Text_Editor_Component.html

  • Displays a field that allows for users to type text and format it with a variety of style options.
  • Output is saved as HTML. To get the raw character output, designers can use the Appian function fn!stripHtml() on the output.
  • HTML output can be passed into Send E-Mail node or document generation smart services. Note that not all formats supported by the Rich Text Editor component may be supported by e-mail or document generation.
  • Allows uploading of images which get stored in the specified Appian folder (requires separate install of the Rich Text Editor Connected System Plugin from https://community.appian.com/b/appmarket/posts/rich-text-editor-image-upload-connected-system).

Visit https://community.appian.com/w/the-appian-playbook/1378/end-user-rich-text-editor-component for more information. If you have any problems installing or using the component, please see the https://community.appian.com/w/the-appian-playbook/1603/rich-text-editor-component-plug-in-troubleshooting-guide

Key Features & Functionality

  • Component: fn!richTextField()
  • Allows for size validation
  • Allows for adjustable height
  • Allows for read-only / editable view
  • Supported font formats: "header", "size", "bold", "italic", "underline", "strike", "color", "background", "link", "align", "indent", "list"
  • Designer control over the allowed formats

Supported Browsers: Chrome, Firefox, Edge, Safari
Supported on Mobile

Anonymous
  • The maxSize is to validate the length of text you actually store in the database, due to your database column limitation.  If your DB column is VARCHAR(100), you can only store 100 characters, including HTML tags.

    The reason for progress bar was to avoid confusion since the actual character count is always larger than the number of visible characters due to HTML tags.

    If you want to validate to 100 non-HTML characters, just hide the progress bar and use striphtml() to calculate how many visible characters are in the field.  However, keep in mind that what's written to the database is generally much larger than the number of visible characters, so we'd always recommend setting maxSize = the size of your DB column, to avoid errors in the write to DB.

  • Are we able to change process bar percentage, wanted to show exact number of char inputted, instead of including html tags?

    For instance: Set maxSIze:100, inputted one alphabet char('a'), progress bar showing 12%, expected output is 1%.

    Can someone help me in this?

  • is this issue resolved chitra?

  • Fast turnaround, the download here has already been updated to be the signed one!  Please re-download.

  • Can you please email richtext-componentpluginsupport@appian.com and we'll provide the signed one via email.  Not sure why it's not on the Download itself, we will sync with someone on that.

  • We won't have the developer token. Can you please provide the signed package for the on-premise environment?

    We are getting this below error.

    [Appian Plugin Hot Deploy] ERROR com.appiancorp.plugins.LoggingPluginEventListener - Failed to load Plug-in 'com.appian.richtext' (com.appian.richtext) version 0.0: 'Component plug-in approval verification failed. Please contact Appian for approval process

    Please let us know if you need any other details.

  • This component is nice. 
    Does it also support super/subscript functionality?

  • Unfortunately Component Plugins aren't supported in either Grids or Side-by-Side Layouts.

    I've logged a use case for you.

  • This component is really useful and works well. I feel, it should be added to Product. However, I came across following scenarios/use cases where I find it difficult to use.

    1. We have a requirement to display rich text created by users via this component in a!gridField() columns. I don't see any support for displaying the rich text as-is from this component.

    2. richTextField() function is not supported in Side by Side layout. I received following error.

    Could not display interface. Please check definition and inputs. Interface Definition: Expression evaluation error at function a!sideBySideLayout [line 6]: A side by side layout has an invalid item. The item at index 1 contains a component that is not supported in a side by side layout. Received: CertifiedSAILExtension.