---
title: Rich text editor
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

To help you with the editing of text fields, the rich text editor allows you to work with content in an intuitive WYSIWYG ("What You See Is What You Get") manner. The editor provides essential formatting functionality, e.g., bold, italics, paragraph formatting, lists, or indentation.

When editing, you can also switch to a code view to see the corresponding HTML formatting of the text. The count of the currently entered characters is always displayed at the bottom right corner of the editor.

![Rich text editor](https://docs.kentico.com/docsassets/documentation/rich-text-editor/rich_text_editor.png "Rich text editor")

## Format text

The rich text editor offers essential formatting functionality. You can use the editor toolbar to format text within the editor.

Following is the default setup of the rich text editor (the editor might offer different functionality in your projects, depending on the configuration [set by the developers](https://docs.kentico.com/documentation/developers-and-admins/configuration/rich-text-editor-configuration/rich-text-editor-customization.md)):

![Rich text editor toolbar](https://docs.kentico.com/docsassets/documentation/rich-text-editor/rich_text_editor_toolbar.png "Rich text editor toolbar")

1. **Bold** (_Ctrl + B_)
2. **Italic** (_Ctrl + I_)
3. **Underline** (_Ctrl + U_)
4. **Paragraph format**
   - Use the **Paragraph format** button to further break down the text into sections using predefined header formatting.
5. **Ordered List**
6. **Unordered List**
7. **Decrease Indent** (_Ctrl + \[_)
8. **Increase Indent** (_Ctrl + ]_)
9. **Align Left**
10. **Align Center**
11. **Align Right**
12. **Code View**
    - Select **Code View** to see and edit the corresponding HTML formatting of the text.
13. **Insert image** – insert a [Content hub](https://docs.kentico.com/documentation/business-users/content-hub/content-item-assets.md) image into the edited content.
    - For step-by-step instructions, including how to insert a specific variant of an image, see [Insert images](#insert-images).
    - Selecting an inserted image offers additional options:
      - **Replace** – replaces the image with another image from the Content hub. You can select an image variant here as well, if available.
      - **Alternative text** – sets the alt text property.
      - **Align** – controls image alignment.
      - **Display** – sets display style.
      - **Change size** – resizes the image.
      - **Remove** – deletes the image.
14. **Insert link**
    - Select any **Asset** from the [Content hub](https://docs.kentico.com/documentation/business-users/content-hub/content-item-assets.md) (e.g., image, spreadsheet, PDF, text document) and insert a hypertext link to the file into the edited content.
    - Select a **Page** from the [content tree](https://docs.kentico.com/documentation/business-users/website-content.md) and insert a link into the edited content. Note that you can only select pages of content types that have the [URL feature enabled](https://docs.kentico.com/documentation/developers-and-admins/development/content-types.md).
    - Select **Web URL** to insert a hypertext link to any external resource into the edited content.

## Insert images

You can add images stored in the [Content hub](https://docs.kentico.com/documentation/business-users/content-hub/content-item-assets.md) to the text, for example, to illustrate an article or a product description.

1. Select **Insert image** in the editor toolbar.

2. Select an image from the _Content hub_.

   ![Insert image panel. A search bar and Filter button run across the top.](https://docs.kentico.com/docsassets/documentation/rich-text-editor/RTE_insert_image_panel.png "Insert image panel")

3. **Insert** the image.

The image now appears in the text. To upload a new image from your device instead, select **Insert image** -> **Upload file**.

To swap an inserted image for a different one:

1. Select the image in the text.
2. Select **Replace**.
3. Select a different image from the _Content hub_.
4. **Insert** the image.

The new image replaces the previous one.

### Insert image variants

[Image variants](https://docs.kentico.com/documentation/business-users/content-hub/content-item-assets.md#image-variants) are cropped or resized versions of an image, such as a wide banner or a square thumbnail. When you insert an image from the [Content hub](https://docs.kentico.com/documentation/business-users/content-hub.md), you can select which variant appears in the text. This lets you show the right crop and size without editing the image itself. The rich text editors in Page Builder and Email Builder offer the same choice.

1. Select **Insert image** in the editor toolbar.

2. Select an image from the _Content hub_.

3. Select a variant in the **Image variant** drop-down list.

   - Each variant shows its size and type, for example, _1600 × 900 px · Smart crop_.
   - _Original_ inserts the source image as uploaded, without any transformations. This is the default selection.

   ![Insert image panel. The Image variant drop-down list above the folder navigation is open and highlighted. It offers Original, selected by default, and the defined variants with their size and type. One image is selected in the item listing.](https://docs.kentico.com/docsassets/documentation/rich-text-editor/RTE_insert_image_variant.png "Insert image panel with the Image variant drop-down list open")

4. **Insert** the image.

The image now appears in the text in the selected variant.

To use a different variant for an image you already inserted:

1. Select the image in the text.
2. Select **Replace**.
3. Select the same image from the Content hub.
4. Select a variant in the **Image variant** drop-down list.
5. **Insert** the image.

The image now appears in the text in the newly selected variant.

> **Tip:** Keep in mind:
>
> - The **Image variant** drop-down list appears only if your administrators have [defined image variants](https://docs.kentico.com/documentation/developers-and-admins/development/content-types.md#configure-image-variants), and only for images from the Content hub. If you don't see the list, ask your administrators to define image variants.
> - Images in formats that don't support variants, such as SVG or GIF, are inserted as _Original_.
> - An image inserted as a variant still shows in the **Used in** tab of the image in the Content hub.

## Allowed HTML attributes and tags

In order to mitigate possible security threats, the rich text editor sanitizes the content's HTML code. That is, any HTML attributes and tags [that are not allowed](https://docs.kentico.com/documentation/developers-and-admins/configuration/rich-text-editor-configuration.md#html-allowed-in-the-editor) are removed. This may in some cases modify or break your HTML code, for example when adding content via the editor's _Code View_ option.
