Text widget

The Text widget allows you to add static or dynamic text to your app.

Examples

Use this widget to support app design requirements such as the following:

  • You want to display text in the app that supports the other content such as data details and image captions.
  • You want to show a dynamic field or expression from a data source. You can combine a Text widget with a List widget so users can click an item in the list to show details for the corresponding feature, such as attribute values.

Usage notes

The Text widget includes a rich text editor in which you can change the font type, size, color, and so on. For dynamic text, you can set the data source to use attributes or get statistics from multiple feature layers. Common text formatting options are available on a toolbar that appears when you're editing in the Text widget. You can access all the formatting options in the widget’s configuration panel. To edit hyperlinked text, click the linked text, click the Link button on the Content tab, edit the configured link, and close the Set link panel.

Tip:

When typing in the text editor, use keyboard shortcuts to undo or redo text edits (Ctrl+Z for undo and Ctrl+Y for redo). The Undo and Redo buttons on the builder toolbar are based on the actions performed in the builder, such as connecting data or adding the Text widget.

When the text takes up more space than the size of the widget, users can scroll through the text within the widget. To indicate when there is more text than is showing, a fade effect appears at the bottom of the widget with a jumping arrow icon in the corner.

Settings

The Text widget includes the following settings:

  • Connect to data—Optionally, connect the widget to specific data. (A data source is not required for a Text widget.)
    • Select data—Select the data to populate content in the widget. You can select multiple feature layers for a single Text widget, and for each feature layer you can add multiple data views. You can combine static text with dynamic content. For example, you can type a sentence and choose one or more fields to populate values from selected features in the connected data.
    • Once you connect data, the Dynamic content button Dynamic content becomes active on the widget’s toolbar so you can continue to configure the data connection.
  • Wrap—Turn text wrapping on or off.
  • Tooltip—Provide hover text to describe the text content. If you connect the Text widget to data, you can use dynamic content by choosing Attribute, Statistics, or Expression
  • Placeholder (available in templates)—When using the Text widget in a Web Experience Template, specify placeholder text to customize the content and style.
  • Text format—Use the following common formatting options:
    • Font—Change the font type and change the font size by unit using pixels (px), rem, or view width (vw).
    • Basic font settings—Apply bold, italic, strikethrough, and underline formatting to text and choose a highlight color and font color.
    • Link—Format text as a hyperlink to go to other content, such as a page, window, section view, or web address. On scrolling pages, you can set a link to scroll to a particular block on the page or return to the top of the page.
    • Paragraph layout—Adjust the paragraph alignment (left, center, right, or justify), use bulleted or numbered list formatting, and increase or decrease the indent.
    • Character spacing—Adjust the space between characters by unit using pixels (px), rem, or view width (vw).
    • Line spacing—Adjust line and paragraph spacing. The default is 1.5 lines.
    • Character effect—Style text characters by adding a shadow.
  • Clear all formatting—Select formatted text and click this button to clear existing formatting.
    Caution:

    When a variable phrase from dynamic content is included in the selected text, this button removes its content because it’s treated as text formatting.

Dynamic content panel

When you connect the Text widget to data, the Dynamic content Dynamic content button becomes active on the toolbar that appears for the widget’s inline-editing mode. This button opens a panel with the following options to get dynamic content from the selected data source:

  • Attribute—Choose the field from the selected data for which you want to show attribute values in the Text widget. Once you choose a field, it’s added to the editable text area as a field name variable—the field name in curly brackets. The variable is populated with feature attribute values based on the connections you configure, such as using a Text widget to show place-names in a list that’s connected to the same data.
  • Statistics—Get statistics function results (MAX, MIN, AVERAGE, and SUM) for a selected field or the data count (COUNT) from the corresponding data source to insert into the text widget.
  • Expression—Build a more complex expression with the five function operators (AVERAGE, COUNT, SUM, MAX, and MIN) and data fields to insert into the text widget.
    Tip:

    To customize the message that appears when no records are selected, change the expression title. The expression title displays as the no data message for text dynamic content. Or you can create a view for empty selection in the Data panel.

For more information about using dynamic content, see Select data.