Skip to content

Text

The Text widget shows a piece of text on a page. The text can be fixed, or it can be filled in from the page's data, so the same widget can show a greeting with the visitor's name or a caption with the selected year. Use it for captions, short explanations, labels next to a chart, and any value you want to display as plain text.

See also Heading for page and section titles, and Badge and Alert for status messages.

Using it

Drop a Text widget onto the page and type into its Text field. To show a value from the page, put the value's name in braces. For example, Welcome back, {$data.customer.name} shows the customer's name from a data source called customer. The text updates on its own when the value changes.

// A value from the page's data
Welcome back, {$data.customer.name}

// A page parameter
Statements for {$params.year}

// A value another widget published
Selected: {$vars.selectedRow.name}

Page and Portal State explains which of these keywords to use where. The syntax inside the braces is the same as in text templates for reports.

Options

Option Values Default Description
Text Any text or template, over several lines Text The text to show
Text Align Left · Center · Right From theme Where the text sits horizontally
Style Italic, plus one of Underline · Strikethrough · Overline Off Emphasis toggles
Inherit styles On · Off Off When on, the text ignores its own theme styling and takes the styling of the widget it sits in. Use this for text inside a section header or footer
Variant Theme variants Default Picks a look for the text from the theme. Hidden while Inherit styles is on. See Variants
Per-part theme styles Theme values From theme Theme values for this one widget. Hidden while Inherit styles is on
Custom Style CSS Empty Extra styling for the text
Box Style Sizing and spacing — The box around the text

Tips

A few things to keep in mind:

  • Templates are evaluated live. When the underlying value changes, the text updates without a page reload.
  • Turn on Inherit styles for text that sits inside another widget's slot and should look like its surroundings.
  • For a title that carries document structure, use Heading instead.