# Editing Text

Elements that allow text editing are found under the 'Basic' category of the Page Element Library.

<div align="left"><figure><img src="/files/RLBXcoNwFgvJBNF8pIcI" alt="" width="176"><figcaption><p>Text Editing Elements</p></figcaption></figure></div>

When you are modifying text, a Text Edit Toolbar automatically appears for the element as shown below.

<figure><img src="/files/ErSn1IxtQHfulVjUUCVK" alt=""><figcaption><p>Text Edit Toolbar</p></figcaption></figure>

The text edit toolbar buttons are:

* Bold selected text
* Italicize selected text
* Underline selected text
* Strike-through selected text
* Turn selected text into a [Link](#link) element
* Start an un-ordered list i.e. with bullets
* Start an ordered list i.e. a numbered list
* Make selection into [Badged Text](/app-editor/page-editor/built-in-elements/badged-text.md).
* Make selection into a [Dynamic Content](/app-editor/dynamic-content.md) placeholde&#x72;**.** (Only applicable if the element is inside a [Data Design](/app-editor/page-editor/built-in-elements/data-design.md) element).

Beyond the above described information, each of these elements differ in their rendering behavior as explained below:

### Text

By default **`Text`** elements occupy the full horizontal area they are contained in.&#x20;

<div align="left"><figure><img src="/files/96jOlsIOUtujW4ZDBzsR" alt=""><figcaption><p>Text elements with the default Type</p></figcaption></figure></div>

{% hint style="success" %}
For writing text over multiple lines, use the **`Text`** element with the **`Type`** setting set to **`Default`**.
{% endhint %}

When  the **`Type`** setting is changed to **`Inline`**  the elements only occupy as much horizontal space as they need as shown below.

<div align="left"><figure><img src="/files/3yOOM4nKKbtrumhCnNKB" alt="" width="563"><figcaption><p>Text elements with the Inline Type.</p></figcaption></figure></div>

Note that in the above example, both the elements have been set as Inline. If only one element is set as Inline, the other element would still occupy the full horizontal space.

<div align="left"><figure><img src="/files/PlgtcJBHqruWBpv9qKAe" alt="" width="563"><figcaption><p>Text element Inline Type setting</p></figcaption></figure></div>

### Inline Text

The **`Inline Text`** element behaves similar to a **`Text`** element with the **`Type`** set to **`Inline`**. The main difference is that **`Inline Text`** elements always remain inline and do not have any other settings.

### Link

The **`Link`** element creates a clickable web hyperlink that can be configured to point at a specific URL.&#x20;

The **`Link`** element behaves similar to an **`Inline Text`** element or a **`Text`** element with the **`Type`** set to **Inline**.

A Link element is created automatically if you use the hyperlink option in the text edit toolbar.

For more information about Link see [**here**](/app-editor/page-editor/built-in-elements/link.md).

{% hint style="info" %}
**`Text`**, **`Inline Text`** and **`Link`** elements use the Body font defined at the page level (in Page Settings) or the Body font defined at the app level (in App Settings). To change the font for a specific element, use the [design tab in the element settings](/app-editor/page-editor/page-element-settings.md#design-tab).
{% endhint %}

### Heading

The **`Heading`** element can be configured for various sizes: Heading 1 (largest) through Heading 6 (smallest).

Unlike **`Text`**, **`Inline Text`** and **`Link`** elements, **`Heading`** elements can contain other elements and thereby have those inherit its font settings.

{% hint style="info" %}
**`Heading`** elements use the Heading font defined at the page level (in Page Settings) or the Heading font defined at the app level (in App Settings). To change the font for a specific element, use the [design tab in the element settings](/app-editor/page-editor/page-element-settings.md#design-tab).
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.zingy.ai/app-editor/page-editor/editing-text.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
