Rich text field

While a plain text field is used for creating short-form, unformatted text, a rich text field is used for long-form content that you can format from the Collections panel in the Designer or the Editor. The rich text field gives your collaborators freedom to create and format their content. The rich text field can be displayed in Collection lists and on Collection pages. You can also use the rich text field to filter a Collection list or set conditional visibility on elements on Collection pages and in lists.

Common uses

• Most long-form content with links
• Blog posts
• Articles
• Team member bios
• Product description
• Event details

Pro tip

Rich text comes in handy when you want to give collaborators the ability to further style text. If you don’t want collaborators to have this ability, the plain text field will be the better choice.

In this lesson

• Creating a rich text field
• Creating rich text content
• Displaying dynamic rich text in your design
• Styling elements nested in a rich text field
• Filtering a Collection list using the rich text field
• Conditional visibility using the rich text field

Creating a rich text field

A rich text field can be added to a new or existing Collection. In Collection settings, click on New Field and then choose the Rich Text field.

Before saving the field, you can set a minimum character count and/or a maximum character count that is allowed for this field. And as with any field, you can add a Help text and specify if the field is required or not.

Creating rich text content

You and your collaborators can create rich text content for each Collection item.

1. Open a Collection item in the CMS
2. Type or paste in your rich text content
3. Format it further or add media
4. Save your Collection item

In a rich text field, you can add:

• Multiple paragraphs
• Images
• Videos
• Rich media
• Bulleted lists
• Numbered lists
• Bold text
• Italicized text
• Link
• Headings
• Block quotes

Recommended reading

Learn more about rich content and how to add, format, and style rich text elements.

Displaying dynamic rich text in your design

To show the content of the rich text field in Collection list or Collection pages, you can add a rich text element and connect it to this field:

1. Add a rich text element in a Collection list or on a Collection page
2. Check the Get text from checkbox in the Inner Text Settings that appears
3. Connect it to the relevant rich text field from the field dropdown

You can also access the Inner Text Settings by selecting the text element and either clicking on the settings icon next to the element label on the canvas or by going to the Settings panel (D).

Styling elements nested in a rich text field

You can set specific styles for each element nested in a rich text, like headings, lists, links, etc. You can do this before you connect your rich text element to a rich text field. Learn more about styling elements nested in a rich text element.

You cannot style elements nested in a rich text element when it’s connected to a rich text field. First, you need to remove the connection, style its elements, then, connect it again to the rich text field. You can remove the connection by unchecking the “Get text from” under Inner Text Settings.

Filtering a Collection list using the rich text field

To filter your Collection list using a rich text field:

1. Select the Collection list you want to filter
2. Go to the Settings panel (D)
3. Add a Filter under Collection List Settings
4. Select the relevant rich text field in the first dropdown
5. Choose a rule in the second field
6. Specify the value if needed
7. Click Save

The filter rules that you can use with the rich text field and values are:

• Is Set - looks for Collection items that have content for this rich text field
• Is Not Set - looks for Collection items that don’t have any content in this rich text field

Learn more about filtering Collection lists.

Conditional visibility using the rich text field

You can set conditional formatting to show rich text content in specific conditions. You can also set conditional formatting, for example, on headings to show them only when a specific rich text field has content:

1. Select the heading
2. Go to the Settings panel (D)
3. Add a Condition (when this element is visible) under Conditional visibility
4. Select your rich text field in the first dropdown
5. Choose Is set in the second dropdown
6. Click Save

Learn more about conditional visibility.