Free cookie consent management tool by TermsFeed

Header Text Component

SAIL Design System guidance available for Rich Text

Enhance readability and comprehension on your interface by using rich text styles to visually differentiate text.

Function

a!richTextHeader( text, size, link, linkStyle, showWhen )

Displays heading-styled text within a rich text component.

See also: Rich text style guidance

Parameters

Name Keyword Types Description

Text

text

Text or Styled Text

Array of text to display as a rich text item.

Size

size

Text

Determines the text size. Valid values: "SMALL", "MEDIUM" (default), and "LARGE".

Link

link

Link

Link to apply to the text. Create links with:

Link Style

linkStyle

Text

Determines how the link is underlined. Valid values: "INLINE" (default), "STANDALONE".

Visibility

showWhen

Boolean

Determines whether the component is displayed on the interface. When set to false, the component is hidden and is not evaluated. Default: true.

Usage considerations

  • If text is null or contains an empty array, no text is displayed.
  • If link is null, the text is not displayed as a link.

Header text and grids

  • While rich text components can be placed inside a grid layout, header styles are not supported within a grid layout.

Examples

Click EXPRESSION to copy and paste an example into the Interface Definition to see it displayed.

Use the interactive editor below to test out your code:

Feature compatibility

The table below lists this component's compatibility with various features in Appian.
Feature Compatibility Note
Portals Compatible
Offline Mobile Compatible
Sync-Time Custom Record Fields Incompatible
Real-Time Custom Record Fields Incompatible

Custom record fields that evaluate in real time must be configured using one or more Custom Field functions.

Process Reports Incompatible

Cannot be used to configure a process report.

Process Events Incompatible

Cannot be used to configure a process event node, such as a start event or timer event.

The following patterns include usage of the Header Text Component.

  • Comments Patterns (Comments, Looping): Use this pattern when displaying a chronological list of messages from different users, such as comments on a topic or notes on a case.

  • Grid with Selection Pattern (Grids): This pattern is an example of good UX design for a grid that allows users to select items and easily view their selections when there are multiple pages of data. It also provides information on a common save behavior.

  • Inline Survey (Radio Buttons, Checkboxes, Buttons): Use this pattern to create a clean and easy to navigate survey.

  • Percentage of Online Sales (Records, Reports, Formatting): This pattern illustrates how to calculate the percent of sales generated from online orders and display it in a gauge component.

  • User List Pattern (Looping): The user list pattern retrieves all the users in a specified group and displays them in a single column.

  • Year-Over-Year Report (Charts, Reports, Formatting): This is a feature-rich, interactive report for sales and profits by products over select periods of time.

Feedback