> For the complete documentation index, see [llms.txt](https://help.fluorescent.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.fluorescent.co/eclipse/sections/rich-text-1.md).

# Rich text

Use the **Rich text** section to add formatted text with additional images and buttons.

{% hint style="warning" %}
**Editing templates will change all pages that use the same template**. [Create new templates](/eclipse/pages/templates/using-templates.md) for different page layouts, or [show dynamic page content](/eclipse/general/editing-themes/dynamic-content-with-metafields.md) in the same template.
{% endhint %}

## Set up section

***

In the editor side panel, click **(+) Add section** and select **Rich text**. Click and hold the drag handles **`⋮⋮`** to re-order sections.

### Section styles

***

Click the section to edit general **section styles** for colors and spacing, available in all sections:

<table data-view="cards"><thead><tr><th align="center"></th><th data-hidden data-card-target data-type="content-ref"></th><th data-hidden data-card-cover data-type="files"></th></tr></thead><tbody><tr><td align="center"><mark style="color:blue;"><strong>Section colors</strong></mark></td><td><a href="/eclipse/sections/overview/section-styles.md#color-scheme">Using sections</a></td><td></td></tr><tr><td align="center"><mark style="color:blue;"><strong>Section width</strong></mark></td><td><a href="/eclipse/sections/overview/section-styles.md#section-width">Using sections</a></td><td></td></tr><tr><td align="center"><mark style="color:blue;"><strong>Section padding</strong></mark></td><td><a href="/eclipse/sections/overview/section-styles.md#section-padding">Using sections</a></td><td></td></tr></tbody></table>

## Add content blocks

***

Click **(+) Add block** to add text and image content to the section. Use the drag handles **`⋮⋮`** to re-order blocks, and add **Spacer** and **Divider** blocks to further customize the layout.

<div><figure><img src="https://3688473072-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHUe2h5JnXOGnUNdkJwav%2Fuploads%2F2bJuQwRSZ37zWPCfgEVZ%2Fcontent-blocks-add.png?alt=media&amp;token=b226c9a1-d607-4439-8f9a-325707fb411f" alt=""><figcaption></figcaption></figure> <figure><img src="https://3688473072-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHUe2h5JnXOGnUNdkJwav%2Fuploads%2FNBntxSpdVe98DZrI1ykk%2Fcontent-blocks-left.png?alt=media&amp;token=85ae78d7-8b34-41c6-a957-498bc5352db4" alt=""><figcaption></figcaption></figure></div>

<table data-view="cards"><thead><tr><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><mark style="color:blue;"><strong>Heading</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#heading-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Text</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#text-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Overline text</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#overline-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Button</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#button-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Image</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#image-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Spacer</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#spacer-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Divider</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#divider-block">Content blocks</a></td></tr><tr><td><mark style="color:blue;"><strong>Custom Liquid</strong></mark></td><td><a href="/eclipse/sections/overview/content-blocks.md#liquid-block">Content blocks</a></td></tr></tbody></table>

### Change content layout

***

Change the width and alignment of the section content. You can also change the section width.

`Click Rich text section to find settings`

<table><thead><tr><th width="171">Setting</th><th width="361">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Content width</mark></td><td>Display the section at full width of the page or set a custom width. Under <em>Section</em>, you can also set the section width.</td><td><strong>Full width</strong><br><strong>Custom width</strong> <em><mark style="background-color:yellow;">Default</mark></em></td></tr><tr><td><mark style="color:blue;">Custom content width</mark></td><td>Use the sliders to set the maximum width (in pixels) of the section content.</td><td><strong>400-1000 px</strong></td></tr><tr><td><mark style="color:blue;">Content alignment</mark></td><td>The position of the headings, buttons, and content within the section.</td><td><strong>Left</strong><br><strong>Center</strong> <em><mark style="background-color:yellow;">Default</mark></em><br><strong>Right</strong></td></tr></tbody></table>