> For the complete documentation index, see [llms.txt](https://help.botpenguin.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.botpenguin.com/ai-agents/creating-ai-agents-in-botpenguin/social-media-widgets/telegram-widget.md).

# Telegram Widget

## Telegram Automation – Widgets

Telegram **Widgets** are routing tools that help users start conversations with your **Telegram bot** through multiple entry points such as websites, links, and QR codes.\
They are designed to **increase bot reach and engagement** by making it easy for users to connect with your bot.

***

### Accessing Telegram Widgets

To access Telegram Widgets:

1. Log in to your **BotPenguin Dashboard**
2. Navigate to **Telegram Automation**
3. Click on the **Widgets** tab

You will be redirected to the **Manage Widgets** screen.

<figure><img src="/files/GXINK87cMUOfUW64qP6e" alt=""><figcaption></figcaption></figure>

***

### Manage Widgets – Overview

The **Manage Widgets** screen displays all available Telegram widgets that you can use to route users to your Telegram bot.

#### Available Widgets

* **Chatbot Icon**
* **Link**
* **QR Code**

Each widget can be expanded to view setup instructions and configuration options.

***

### Chatbot Icon Widget

The **Chatbot Icon** allows you to add a Telegram chat icon to your website.\
Visitors can click the icon to instantly open your Telegram bot and start a conversation.

#### How to Install the Chatbot Icon

1. Click on **Chatbot Icon**
2. Click **Copy Chatbot Code**
3. Paste the copied code into your website’s **header file**
4. Deploy the updated website code

Once installed, the Telegram chatbot icon will appear on your website.

> 📌 *Tip:* The icon usually appears at the bottom corner of your website for maximum visibility.

<figure><img src="/files/AVzDD1FQzAQV5Bz94atq" alt=""><figcaption></figcaption></figure>

***

#### Editing the Chatbot Icon

To customize the chatbot icon:

1. Click **Edit Icon**
2. Modify the icon settings as required
3. Save your changes

You can preview the widget on the right side of the screen before deploying it live.

***

#### Need Help with Installation?

* Click **Need Help?** for guided setup assistance
* Useful if you are unsure where or how to add the code to your website

***

### Link Widget

The **Link** widget generates a shareable Telegram bot link that redirects users to your Telegram bot in a single click.

#### Common Use Cases

* Email campaigns
* Social media posts
* Website buttons
* Landing pages

When users click the link, Telegram opens automatically (or via browser) and starts the bot.

<figure><img src="/files/Z725vOYQB50uQAfKpzGX" alt=""><figcaption></figcaption></figure>

***

### QR Code Widget

The **QR Code** widget allows users to scan a QR code and instantly connect with your Telegram bot.

#### Common Use Cases

* Offline marketing materials (posters, flyers)
* Business cards
* Event booths
* In-store displays

Users simply scan the QR code using their mobile device to start chatting with your bot.

<figure><img src="/files/OQ5UtWP8o5vziRkLy8er" alt=""><figcaption></figcaption></figure>

***

### Best Practices

* Use the **Chatbot Icon** to capture website visitors
* Share **Links** across digital channels
* Use **QR Codes** for offline promotions
* Always test widgets before public distribution

***

### Notes & Limitations

* Widgets redirect users to the Telegram platform
* Users must have Telegram installed or accessible via browser
* Internet connection is required
* Telegram platform policies apply to all interactions

### FAQ's:

Here are some common FAQ's that are seen in the Telegram Broadcast section:

<details>

<summary>Do I need technical knowledge to use Telegram Widgets?</summary>

1. **Chatbot Icon**: Requires basic technical knowledge to add a code snippet to your website header.
2. **Link & QR Code**: No technical setup required.

</details>

<details>

<summary>Where should I place the Chatbot Icon code on my website?</summary>

The Chatbot Icon code should be added to your website’s **`<head>` section** or global header file so it loads across all pages.

</details>

<details>

<summary>Can I customize the Telegram Chatbot Icon?</summary>

Yes.\
Click **Edit Icon** to customize the icon’s appearance or behavior before deploying it on your website.

</details>