Skip to main content
All CollectionsBest-Practices
Text with formatting
Text with formatting

HTML formatting in rich text fields

Updated over 7 months ago

Some fields on exercises show a rich text editor

Textarea with formatting controls, showing a formatted text "Do not forget this very important word: Consistency" with "important" in bold and "Consistency" in italic.

You can use the formatting features to better convey your message or better structure information.

Rich text fields in exercises

The following fields on exercises support rich text input.

  • Description

  • Coaching Tips

  • Impact

Export and import

Exporting exercises to a CSV file and importing them back will retain the formatting. However, if you want to change the formatting in the exported CSV file with a text editor or Excel, you may struggle to see the changes you have made when importing the exercise back.

Trayn stores the formatting inside a single value (the "V" in CSV) as HTML. The text in the image above will look like this in a CSV export:

<p>Do not forget this very <strong>important</strong> word: <em>Consistency</em></p>

HTML tags

The text consists of tags (between < and >) and formatting is applied to text between an opening (<strong>) and a closing tag (</strong>). From the many tags that HTML supports, the rich text fields support a small subset

Paragraph – <p>

A paragraph can be used to group several sentences into a block which will be separated from other paragraphs by a newline

Quote – <blockquote>

Will change the formatting a little bit so that it can be distinguished from normal text

Headings – <h1>, <h2>, <h3>

Starting with <h1>, a large heading, the font size decreases to a medium heading, <h2> and the smallest heading <h3>.

Bold – <strong>

Increases the font weight of the text

Italic – <em>

Also called cursive, the text is slanted slightly to the right.

Lists – <ul>, <ol> with <li>

Unordered lists (<ul>) will have bullet points and ordered lists (<ol>) will show increasing numbers for each list item (<li>):

Bullet list

<ul>
<li>This is the first item</li>
<li>This is the second item</li>
</ul>

Numbered list

<ol>
<li>This line will start with "1."</li>
<li>This line will start with "2."</li>
</ol>

Links – <a>

Links can be used to point to a different page or website.

See also

Did this answer your question?