# About HTML Text Formatting in Telegram and Widget

HTML tags allow styling message text in bot scenarios for Telegram and Widget channels. This allows highlighting important information, adding links, and formatting text for better readability.

---

## Context and Problem

In many scenarios, you need to highlight important information in message text:
- Bold text for headers or key points
- Links to external resources
- Code or technical terms
- Structured text with different styles

HTML formatting solves this task by allowing using standard HTML tags to style text.

---

## Key Concepts

### Channel Support

HTML tags work only for **Telegram** and **Widget**. For other channels (Viber, Facebook Messenger), HTML tags are not supported, and text displays as regular text.

### parse_mode Configuration

To use HTML tags, you need to specify `parse_mode: "HTML"` in the message block JSON configuration. This tells the system that the text contains HTML tags and they need to be interpreted.

---

## Supported HTML Tags

### Basic Formatting Tags

- `<b>text</b>` — bold text
- `<i>text</i>` — italic
- `<u>text</u>` — underlined text (Widget only)
- `<s>text</s>` — strikethrough text

### Tags for Links and Code

- `<a href="https://www.example.com/">link</a>` — link
- `<code>code</code>` — inline code (monospace font)
- `<pre>code block</pre>` — code block (multiline code)

---

## Approach Options

### HTML vs Markdown

**HTML formatting:**
- ✅ Pros: Standard approach, supported by Telegram and Widget, many capabilities
- ❌ Cons: Does not work for Viber and Facebook Messenger

**Markdown formatting:**
- ✅ Pros: More readable syntax, supported by some channels
- ❌ Cons: Limited support in different channels

**Why we use HTML:**
HTML is the standard format for Telegram Bot API and Widget, ensuring compatibility and predictable behavior.

---

## Adopted Solutions

### Limited Channel Support

HTML tags work only for Telegram and Widget due to API limitations of other channels. For Viber and Facebook Messenger, you need to use other formatting methods (for example, keyboard styling for Viber).

### Support for Only Basic Tags

The system supports only a limited set of HTML tags that are safe and supported by Telegram API. This ensures compatibility and avoids security issues.

### Required Protocol for Links

Links in `<a>` tags must have `https://` or `http://` protocol. This is a Telegram API requirement for security.

---

## Implications for Users and Implementation

### For Integrators

When using HTML formatting, it's important to:

1. **Check channel** — HTML works only for Telegram and Widget
2. **Add parse_mode** — must specify `parse_mode: "HTML"` in JSON configuration
3. **Use correct tags** — only supported tags will work
4. **Check links** — links must have `https://` or `http://` protocol

### Common Errors

**Error:** HTML tags do not work in Viber  
**Problem:** HTML formatting is not supported by Viber API  
**Solution:** Use keyboard styling for Viber or regular text

**Error:** HTML tags display as text  
**Problem:** `parse_mode: "HTML"` is not specified in configuration  
**Solution:** Add `parse_mode: "HTML"` to block JSON configuration

**Error:** Link does not work  
**Problem:** Link does not have `https://` or `http://` protocol  
**Solution:** Add protocol to link: `https://example.com`

### Limitations

- HTML tags work only for Telegram and Widget
- Not all HTML tags are supported (only those listed above)
- For Widget, some tags may display differently than in Telegram
- Links must have `https://` or `http://` protocol

---

## Usage Examples

### Bold Text

```
<b>Important Information</b>
```

### Italic

```
<i>Additional Information</i>
```

### Link

```
<a href="https://example.com">Go to Site</a>
```

### Style Combination

```
<b>Bold</b> and <i>italic</i> text with <a href="https://example.com">link</a>
```

### Code

```
Use command <code>git push</code> to send changes.
```

---

## Related Documents

- **Reference:** [Telegram Bot API - HTML formatting](https://core.telegram.org/bots/api#html-style) — official Telegram documentation about HTML formatting
- **Explanation:** [Viber Keyboard Styling](/en/scenariodialog/explanation/viber-keyboard-styling.md) — formatting for Viber through keyboards