Setting up a Telegram Chat Widget

Telegram is fast, secure, and widely used making it a powerful channel for real-time user engagement. With BotBee, you can easily integrate a Telegram chat widget into your website and start conversations instantly.

Here’s a step-by-step guide to set it up.

Step 1: Access the Chat Widget Creator:

• Log in to your BotBee dashboard
• Navigate to Bot Manager under Telegram Section.
• Click on Chat Widget and Click on Create button.

This will open the Visual Flow Builder, where you’ll design your widget and chatbot flow.

Step 2: Configure Widget Settings:

• Upload your chatbot logo
• Choose a header color using the color picker
• Set your Display Name
• Write a Welcome Message (This will be the message that will appear from your side.)

• Choose where the chat bubble will appear on your website.
• You can position it at the top left, bottom left, top right, or bottom right, whatever suits your layout best.
• Fine-tune the position of your chat widget by adjusting the x-axis and y-axis offsets. This lets you control how far from the edges your chat box appears.
• You can choose to keep the chat box open by default to grab attention or closed for a more minimal look.
• Timing: Set a delay (0–60 seconds) for when the widget appears after page load.
• Button Design: Customize text, size, and colors (background, text, hover effects)
• Reference: Add a unique reference ID (only letters and numbers, no spaces or symbols)
• Save the Settings.

• Double-click Start Bot Flow and give it a name.
• Once done, click Save.

Step 3: Embed on Your Website:

• After saving the bot, Click on Get Embed Code.

• Here we can see a JavaScript code and a shortlink URL to use on emails or share anywhere in the internet, we just need to add this JavaScript code on the website now.
• Copy the JavaScript snippet provided.

• Paste it into your website’s HTML (usually before the </body> tag)

Step 5: Test and Verify:

Before going live, always test:

• Visit your website and check if the widget appears correctly.

• Interact with it to ensure buttons and replies work smoothly.

Final Thoughts

A Telegram chat widget is more than just a contact option it’s a direct line to your audience. With BotBee’s automation and flow builder, you can create smooth, interactive conversations that feel natural and drive real engagement.

Reference Video:

If you prefer video tutorials here are the links:

English: https://youtu.be/MiVYT3I_ris?si=vcwfeTHFKvj5w8lt

Still Need Help?

If you face difficulties during onboarding:

• Take a screenshot or screen recording.
• Share details with our support team.

Our team will review the onboarding step and guide you further.

Contact: 08069645300