CMS: Formatting a Text Element Connected to a Rich Text Collection Field
3 min read
The formatting of the text does not need to be uniform throughout. Different parts of the content can be formatted differently.
Use rich content to unlock a more extensive set of content editing tools. Rich content allows you to edit text, images and video directly from within the CMS. You can add, edit, and delete the fields in the same way you would edit any other field type and display the content on a dynamic page. Learn more about rich content and the CMS.
In this article, learn about:
Formatting rich text by theme
Set your rich text field's formatting using text themes in the CMS. These text theme settings link to the definitions set in the Editor.
Use this table to see what themes to customize in the Editor to change the rich text format in the CMS:
Theme in Collection
Corresponding Theme Name in the Editor
For example, let's say in the collection you enter two lines of text into a rich text field. You set the first line's formatting to the Section Title theme, and you set the second line's formatting to the Normal Text theme.
Now, in your site Editor, you change the Heading 2 theme to be Arial 100px. When the rich text field's content is displayed, it uses the corresponding Title style. The first line of your content is formatted as Arial 100px regardless of what it looked like in the CMS because the element applies the Editor's Heading 2 theme.
Remember, themes are defined site-wide. Use themes when you want to remain consistent with the rest of your site. If the formatting of a theme in your site changes, you won't have to worry about changing the formatting of the content in your rich text fields.
Customizing line spacing of rich text by theme
Use the Site Theme panel to adjust character and line spacing of the text styles on your site. Adjustments you make in the Site Theme panel automatically apply to your site's rich text.
To customize line spacing of rich text by theme:
- Click the Site Design icon on the left side of the Editor.
- Hover over Custom Theme and click Customize.
- Click the Text button.
- Hover over the required text style and click the Edit icon .
- Use the sliders to adjust the character and line spacing.
- Click Apply.